Plugin Author
malihu
(@malihu)
Can you explain what doesn’t work properly?
It does not go to the correct location. I have only 4 tabs: Home, About Us, Location, Contact Us. I setup the offset as #masthead (per SiteOrigin instructions). When you click on About Us, it first pulls up the About Us headline to the top of the page – that’s what I want. However, when you click on Location it goes to the bottom of the headline and the heading is off the page. If you then click back to About Us, the bottom of the headline is on the page – it isn’t working consistently and not working like a menu. I tried changing the slider to a hero image (SiteOrigin thought the slider might be the problem), but the behavior of the menu didn’t change.
Plugin Author
malihu
(@malihu)
The issue you’re having comes from the way your theme changes the top header position from relative (non sticky) to fixed (sticky) while the page is scrolling.
When the top header is sticky (i.e. when the page has scrolled down a bit) all your targets have different positions than when the header is not sticky (i.e. when the page has not scrolled and is at the very top).
I don’t know why the theme devs made it that way but you can change this via CSS and fix the issue with the scrolling position/location.
Firstly, go to plugin settings and change the “Offset” option value to:
.site-navigation
and click save changes.
Add the following css to your theme (e.g. in appearance > customize > additional css):
.main-navigation.use-sticky-menu {
position: fixed;
top: 0;
right: 0;
left: 0;
margin-right: 0;
margin-left: 0;
}
That’s it. Let me know if it works.
