Archived topic
Page Anchor issue
12 replies · Started by Craig on November 26, 2020
Hi Everyone,
I am having an issue with sections loading using Div Anchors ie .../#section1:
https://fitnina.wpengine.com/work-with-me/
Within the menu items I have some sub-menu item dropdowns for /work-with-me, I was hoping that when click would click on the sub menu item, like "Group Coaching" it would take you to a different section of the work-with-me page for that pertains to "Group Coaching". However, it seems like those div anchors only work when I am actually on the page Work-with-me page. If I am on another page of the site, and I click a submenu item for work-with-me. It just loads the page, doesn't take you to that section on the page. Hoping you can help me out.
I think I might have figured it out here: https://community.wpbeaverbuilder.com/t/anchor-links-to-another-page-not-working-in-chrome/10557/7
Then I just created a header hook:
<script>
jQuery(document).ready(function () {
setTimeout(function () {
var hash = window.location.hash;
window.location.hash = "";
window.location.hash = hash;
}, 300);
});
</script>
Not sure if that is the best way to go about fixing this.
Hi there,
yes that is a good solution for the issue, theres no other way of doing it without adding some Javascript.
Ok great, I have the hook in the header. Should I have that in the wp footer instead? Or does it not really matter?
I am noticing that it works on desktop but not working with my off-canvas on mobile. Any possible solution?
Strange, does it work again if you remove the above code?
Hey Tom and David
It doesn't work even when I remove the above code. I tried making a hook with the same code, only targeting the slideout menu and not wp head. (This was just a shot in the dark).
I did figure out something that seemed to work. Within the Off-Canvas widget if I use custom HTML and just manually create the aref tag. The link seems to work, but not with menu items. Not sure if that helps with recreating a solution to still use the menu items instead of custom html.
Strange - it's not allowing the link to even navigate to the page.
I just tested this locally and couldn't reproduce. Is there any other custom code related to this functionality on your site that we can disable temporarily?
Hey Tom
I was using the code from this: https://docs.generatepress.com/article/animated-hamburgers/
I had gotten the hamburger menu to animate, but seems like that was what was causing the issue. Once I removed it from function and removed the css it works now. I did notice when I would select the menu item from off canvas the hamburger toggle would close.
Ahh, interesting.
Can you try the updated javascript on that page?: https://docs.generatepress.com/article/animated-hamburgers/
Awesome! that did it. Thanks so much, what was it? Was it in the php? Just curious trying to learn more about coding. Thanks again though.
Just a small bug in the JS for the animated burgers. Glad it worked! :)
