Archived topic
Mobile menu open fully expanded
7 replies · Started by Mark on July 16, 2017
Any way to click on the hamburger and have the mobile menu open fully expanded? For example...
Instead of:
HOME
SERVICES (down arrow)
CONTACT US
TESTIMONIALS
I would like to see:
HOME
SERVICES
Service 1
Service 2
Service 3
CONTACT US
TESTIMONIALS
Hi there,
You can create a menu specific for mobile and just add all the items as parent menu items.
This site is using this idea as well.
Let me know if this works.
Hi Leo, I was looking for the lazy way out, perhaps adding some CSS or adjusting some javascript to get an expanded mobile menu but your suggestion sounds good too. Thanks!
No problem!
Loving this theme! Other than Leo's suggestion of creating a separate slide out menu to show all menu items in mobile, is there anything I can do to CSS to achieve the below? I am concerned that viewers will not notice the sub menu down arrow when using a phone. Thanks!
Instead of this on mobile:
HOME
SERVICES (down arrow)
CONTACT US
TESTIMONIALS
I would like to see this:
HOME
SERVICES
Service 1
Service 2
Service 3
CONTACT US
TESTIMONIALS
So you don't want to use the slide out menu?
If so I guess you can add Service 1/2/3 twice, one as sub menu and hide-on-mobile and one as parent menu item and hide-on-desktop. See the first example here:
https://docs.generatepress.com/article/responsive-display/#using-our-hide-on-classes
Thanks Leo! The hide-on classes are helpful. Slide out menus always feel awkward to me for some reason. Anyway, I appreciate your help and wish everyone in the GeneratePress family a Happy New Year!
No problem and you as well :)