Hi there,
Hoping for some assistance to troubleshoot an anchor link on a one page navigation (active) page. It seems to work fine on the home page (one page navigation active) but on the few extra pages created the link to that anchor do not line up correctly with the section they should be scrolling to, it’s always one section above where it should be. I’ve tried to troubleshoot and can’t get it to work properly, it would be amazing if someone can assist.
Hi @DeeDesign,
I couldn’t replicate this issue on my end.
Could you please share us with your screencast to describe your issue?
Thank you.
Thank you Thai - video attached below in a private note. Issue is in FF 66.0.4 - theme and cornerstone are up to-date. Not sure what I’ve done wrong to make it not work on this side. From the external pages the contact us scrolls to the right place and then ‘pops’ back up to the quote above - very strange ??
Hey @DeeDesign,
Thank you for the screencast. That pointed me to the cause. The issue is that there is no space or there should be a space after your Contact section that is higher than your screen’s height. For example, if your screen size is 2560 x 1440px, the space or gap below the contact section should be 1050px since the height of the contact section is 425px.
The issue does not happen on our end because we’re viewing from a short monitor.
I’d recommend that you insert extra content below your contact section. To quickly test though, add a Gap shortcode or element with the size of 1050px or more below your Contact section.
Hope that helps.
Thank you Christian - I followed your advise and added the gap for 1050 below the contact section but this did not solve the issue, instead the link from the members page now scrolls down not above the contact section but halfway through the section - still not hitting that anchor mark correctly.
Cancel that… maybe it did work. I added a template section to extend the page and that seems to work - though not the best in a design sense. Is there no other work around to have anchors work at the bottom of the page (from an external page link)?
Hey @DeeDesign,
The Gap size of 1050 is only a recommendation to quickly test my point that you need to lengthen the page so that the scrollbar has more room below so it could continue scrolling down and thus pushing your contact section up.
I doubt that the Smooth Scroll is causing the issue. The difference between your sites is that the contact section in the site that works is taller than the site that does not work. I’m sorry I forgot to say that making the section taller could also help.
Please take a look at the section height difference in the screenshots below.
Site that works:
Site that does not work
Try bumping up the size of your map higher in the site that does not work. If you’re using the Aspect Ratio Content Sizing, bump up the right value which is the vertical value.
If you’re using Fixed Height, simply bump up the Content Height value.
Hope that helps.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.