Archived topic
Hamburger menu - possible with drop down that also displaces content?
4 replies · Started by Alf on February 24, 2020
Hi there,
I am currently using the off canvas menu, overlay style on my site. Is there a way I could achieve a look similar to the Site library - "Grill" theme, where pushing the hamburger icon opens up a drop-down and also displaces the content down? I´d like the hamburger to be visible at all screen widths.
Thanks in advance!
Kind regards,
Alf
Hi there,
You would need to disable the Off-Canvas panel in that case, as Grill is using the standard mobile menu.
Then you can just adjust the Mobile Breakpoint option in Customize > Layout > Primary Navigation to something high for it to appear on desktop.
Let me know if you need more info :)
Great that works! Only thing is it seems the controller of the menu item height (currently at 65px) now also adjusts the size of the site logo. Is there a way to reduce menu item height independently? Ideally, I´d like the items a bit closer.
It seems that for adjusting sub-menu item height (now at 4px) works fine without impacting logo.
Thanks again!
Think I might found a way by setting the a constant logo size by adding this css:
navigation-branding img,
.site-logo.mobile-header-logo img {
height: 65px;
}
From:
https://generatepress.com/forums/topic/resizing-the-logo-on-landing-page/
Seems to work on my pc and mobile!
Best,
Alf
That's the best way to do it. Glad it's all working! :)