Archived topic
Hamburger menu in desktop menu
5 replies · Started by Jim on June 25, 2019
Hi. If you look at my site you can see a 'more' link with a submenu. I was thinking, how difficult would it be to change it to a hamburger menu on the desktop which retracts to show those items instead? I would hide it in the mobile menu (which I have set at 959px).
Hi there,
You can turn it into a toggle by adding slideout-toggle class to the menu item:
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#custom-classes
Make sure it's activated for desktop:
https://docs.generatepress.com/article/off-canvas-panel-overview/
Let me know if this helps :)
That didn't go too well because the mobile menu is also showing on desktop and the hamburger icon shows on the more link and all its submenus. Preferably, I would prefer it slides down rather than pop up like off canvas panel.
Ahh if you are already using the slideout on mobile then the only choice is to use the built-in hide-on classes described in the first example here:
https://docs.generatepress.com/article/responsive-display/#using-our-hide-on-classes
Unfortunately the 2 styles we have available is the slide (from left or right) and overlay.
This is more difficult to implement than I thought. Did more research and found out it is not bad to have more link for less important menu items as compared to using hamburger menu on desktop. Thanks anyway.
No problem :)
