Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Hide on mobile html anchor link

  • Hi Guys,

    I have encountered some sort of issue i cant seem to resolve alone of with prior support topics.

    There is this review page: https://thissenautos.nl/beste-telefoonhouders-voor-auto-review/

    On the page there is a TOP 10 overview (table) with page links to html anchors. #nummer-1, #nummer-2 (nummer is Dutch for number)

    Also I use 2 different types of product presentation. 1 for mobile and 1 for desktop. But I can’t seem to get both devices to work as should. Either it works on desk or mobile. On the other device the link just jump back to the header. Is there a clean workaround possible here?

    You can aslo check https://thissenautos.nl/beste-fietsendrager-trekhaak/ and hit the button in the header to go to the top 10 overview. Here try the links, then do the same on mobile.

    Hoping for a solution! Kind regards…

  • Hi Nicky,

    The Container where the button is has a hide-on-mobile. Did you add this? It’s not appearing.

    Can you remove that?

  • Yes I added this.

    So let me try to explain again.

    There is a overview of a top10. In this table there are inpage-links.

    Each product review has several section.

    —————————————————————————
    A1. Introduction product – css: hide-on-mobile – html anchor: nummer-1
    A2. Introduction product – css: hide-on-desktop – html anchor: nummer-1

    B. Tekst and impage or video

    C: Pros – Cons

    D: 2 Buttons
    —————————————————————————

    Now form the Top 10 Table i am linking to #nummer-1. Expecting to go to A1 on desktop. And the same link go to A2 on mobile.

    Except this does not seem to work. It either works on Mobile or on desktop, but not both on the same page.

    I hopes this gives you a better idea of the problem I am facing.

  • So now I am thinking to make a second table with the top 10 lists. One list i hide on mobile the other on desktop and I can use different anchors for mobile and desktop..

  • I see. Thank you for clarifying. Yes, what you have now won’t work. The Anchor ID should be unique – there should be one instance of it on the page regardless if you’re not displaying one on specific views.

    You’re correct, creating a second Table would be one approach to fix this.

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.