Archived topic
Feature Request: Hook: generate_inside_sticky_navigation
3 replies · Started by Zach on July 29, 2017
I wanted to add an element to my sticky navigation, but hide it from the normal navigation. I didn't see a hook for this so I used the "generate_inside_navigation" hook to insert it so it shows on normal + sticky nav. Then I used CSS to show/hide it as appropriate. I discovered that I could select the following IDs to differentiate between sticky and normal:
#sticky-navigation
#site-navigation
So, the following code works (my element is classed "logo-headline"):
#sticky-navigation .logo-headline { /* turn it on for sticky nav */
display: block;
}
#site-navigation .logo-headline { /* turn it off for normal nav */
display: none;
}
Note that for the mobile menu there are several hooks ("generate_inside_mobile_XXX") that cover similar cases but nothing that targets the sticky nav. It would be great if there was a "generate_inside_sticky_navigation" hook too.
Thanks for an awesome theme. The more I dig the more I love it!
The sticky nav and the regular nav are actually the same element, it just becomes sticky under certain conditions. The way you've done it above is perfect, however I would suggest using the .navigation-stick class instead of the ID.
Updated. Thanks for the tip.
For future searchers, here's the final code (my element is classed “logo-headline”):
.logo-headline { /* turn it off for normal nav */
display: none;
}
.navigation-stick .logo-headline { /* turn it on for sticky nav */
display: block;
}
Perfect, thanks for sharing :)