Linking to an anchor from a different page jumps to wrong section

  • I’ve set-up a few anchors on this page to jump to different sections.
    On that page, using the anchors links works great.
    My problem is if I try to link to an anchor on that page from another page/post or just try to visit the page with the anchor attached to the URL directly in the browser.

    For example, in this blog post, the link for “feature releases” should be going to the same spot as the anchor link for “Long-Term Support…” in the page above. However it goes much further down. Or you can just view the direct link to the anchor for the Long Term Support and it creates the same problem.

    I’ve set these up as standard anchor links, adding and id=”anchorLink” to the parts of the content I want to link to and when on the same page using the href=”#anchorLink” and from a different page the full page URL plus #anchorLink.

    Wondering if anyone else has come across this issue?

    The site uses the BeTheme and the BeBuilder for the content on the page with the anchor links.

    • This topic was modified 1 year, 10 months ago by pixelvwp.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

  • It may be the “wrong” section per your expectation, but it’s the correct section per the browser’s calculations and the technical standard.

    This is a common problem with sticky or fixed headers!

    The beginning of the correct section (where the anchor should be jumping to) is hidden behind the sticky/fixed header, making it seem like it jumped to the wrong place.

    You may temporarily disable your site’s sticky/fixed header feature to test this.

    Ideally, any theme with a fixed/sticky header should address this problem. Your theme is a commercial product, so I’m unable to install it and test out the settings.

    Please see if any of the solutions on the following links work for you:

    https://getpublii.com/blog/one-line-css-solution-to-prevent-anchor-links-from-scrolling-behind-a-sticky-header.html

    https://stackoverflow.com/questions/4086107/fixed-page-header-overlaps-in-page-anchors

    If none of the above solutions works for you, I’ll recommend you reach out to your theme’s developer for help.

    Good luck!

    Thread Starter pixelvwp

    (@pixelvwp)

    Hi @gappiah, I appreciate your response but think that perhaps you didn’t fully look at the problem I am having. This issue goes much further than simply going behind a sticky header.

    So again, each anchor goes to the correct spot when clicking them from the same page. It’s when you try to visit them from a separate page, or load them as a direct link that the issue arises.

    For example this link. This anchor is attached to one of the bulleted points at the top of the page but if you click on it directly from this page, it instead goes to a point on the page that is about 4 paragraphs lower, a distance much greater than the sticky navigation bar.

    What I am having trouble with is understanding why the anchor will go to the right spot if clicked on the same page, but it won’t go to the right spot when clicked on from a different page.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Linking to an anchor from a different page jumps to wrong section’ is closed to new replies.