- This topic has 14 replies, 4 voices, and was last updated 3 years, 8 months ago by Leo.
August 18, 2018 at 10:24 am #652873Sherina
Hello, I am having a trouble trying to configure my navigation menu for mobile devices. I have searched the forums and found bits and pieces, but still can’t achieve the look I’m going for.
To start I have used this tutorial to center my logo in the nav menu. That works perfectly.
Now, I’m trying to get my mobile logo and nav to pretty much have the same settings as the GeneratePress site. For tablet view I would like to have the same centered logo as the desktop, then switch to logo centered on top and menu beneath for smaller/vertical tablets, then switch to icon size logo and menu toggle for smaller mobile views.
Hope this is making sense.
ThanksGeneratePress 2.1.3GP Premium 1.7.1August 18, 2018 at 6:45 pm #653114LeoStaffCustomer SupportAugust 19, 2018 at 5:20 am #653344Sherina
I just sent the url but I currently have the site offline mode active as I am working on building the site. Would you need my wp login?August 19, 2018 at 8:38 am #653560DavidStaffCustomer SupportAugust 19, 2018 at 8:46 am #653569Sherina
Ok. Just provided login via the Account issue form.
Thanks!August 19, 2018 at 4:26 pm #653802TomLead DeveloperLead Developer
You have quite a few menu items, so I’m not sure how we’d keep your menu centered on smaller screens.
We could reduce the width of the logo maybe?August 19, 2018 at 6:08 pm #653838Sherina
Yes, I have a smaller logo that I can use for smaller screens. When I upload it though, it is really tiny.August 19, 2018 at 6:15 pm #653844Sherina
I can’t seem to increase the size of my mobile logo, without also increasing the menu item space.August 19, 2018 at 7:00 pm #653860LeoStaffCustomer Support
First you have some Elementor spacer in there that you might want to remove:
Then you can follow the steps here to set mobile header height different than the menu item height:
https://generatepress.com/forums/topic/menu-item-width/#post-596935August 20, 2018 at 8:31 am #654489Sherina
I think I got it working.August 20, 2018 at 9:22 am #654565LeoStaffCustomer SupportAugust 23, 2018 at 9:01 am #658029Sherina
Hello, another question…still working on my mobile menu settings.
I’m testing my mobile menu using the breakpoint of my iPad in portrait view. I have the logo centered like I want it, but instead of the mobile hamburger menu, I would like the full desktop menu to center under the logo, at the set width.
So how do I remove the hamburger menu for this particular breakpoint – @media (min-width: 769px) and (max-width: 1200px)?August 23, 2018 at 3:30 pm #658381LeoStaffCustomer SupportAugust 23, 2018 at 4:30 pm #658408Sherina
No, not just increase the breakpoint, I don’t think… At a certain breakpoint, instead of the menu falling below the header left aligned, I would like it to center align, along with the logo. Just like the header on the generate press website.August 23, 2018 at 8:28 pm #658521
- You must be logged in to reply to this topic.