Archived topic
Simple Mega Menu on Mobile with submenus
6 replies · Started by Mark on June 17, 2020
I used the instructions at https://docs.generatepress.com/article/building-simple-mega-menu/ to create a mega menu with several parent and child menus, and numerous grandchild items.
I then used David's CSS to hide the child menu titles / headers as in:
https://generatepress.com/forums/topic/gp-mega-menu-hide-column-headers/
But problem!
In the mobile off canvas menu, the child item headers still show up, even when I comment out the conditional CSS restriction that keeps David's CSS from operating on mobiles, i.e. /* @media (min-width: 769px) { */
Solution? Another menu for mobile use only? Any easy way of copying the existing (large) primary menu without using a plugin?
Hi there,
Any chance you can link us to the site in question?
You can edit the original topic and use the private URL field.
Let me know :)
Thanks Leo, site attached. Ignore the SSL problems, this site just went live 20 minutes ago and there are some teething problems
Bugs fixed, you should be able to see the behavior of the 'simple mega menu' on mobile now.
Instead of using CSS, what if you create a new menu specific for the mobile and assign it to the off canvas navigation?
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#create-a%C2%A0new-menu
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#setting-a-theme-location
Yep, I used the 'duplicate menu' plugin to make it easy. Thanks
No problem :)