Archived topic
Navigation Menu: delete Breakpoint show mobil menu instead
6 replies · Started by Philipp on March 16, 2019
Hi GeneratePress-Team,
great work that you are doing. I like the theme very much! :)
Maybe you can help me out with a small problem in the navigation. I would like to show the mobile menu instead of having a breakpoint menu. Unfortunately the breakponit menu looks a bit weird (maybe because of the special logo position), so i would prefer to hide it and sow the mobile menu.
Breakpoint menu
https://imgur.com/pEFltf4
Normal Menu
https://imgur.com/CtxFl9J
Mobile menu:
https://imgur.com/6FRjjzx
Thank you a lot! :)
Hi there,
You can give this option a shot:
https://docs.generatepress.com/article/navigation-drop-point/
Or try this:
https://docs.generatepress.com/article/mobile-navigation/#initiating-the-mobile-navigation-at-a-different-width
We've actually added the breakpoint option in the customizer in the next version of GP Premium. The alpha version should be released this upcoming Monday :)
Hey Thank you,
i tried this:
- Navigation drop point: 0
- Mobile navigation css changed.
but i got this result:
Some more ideas? :)
Just try one of the options above at the time. Not both at the same time.
The second solution should work better for you I think.
Thanks again. Now only the white background is missing:
I Found a solution with the following css and set the Navigation drop point to 1300
@media (max-width: 1300px) {
.main-navigation .menu-toggle,
.main-navigation .mobile-bar-items,
.sidebar-nav-mobile:not(#sticky-placeholder) {
display: block;
}
.main-navigation ul,
.gen-sidebar-nav {
display: none;
}
[class*="nav-float-"] .site-header .inside-header > * {
float: none;
clear: both;
}
[class*="nav-float-"] .site-header > * {
background-color: #ffffff;
}
.header-wrap {
position: unset;
left: 0px;
right: 0px;
z-index: 10;
}
.navigation-stick:not(.mobile-header-navigation) .menu-toggle {
display: inline-block;
clear: none;
width: auto;
float: right;
}
.site-logo.sticky-logo.navigation-logo {
margin-bottom: 0px;
}
}
Yeah the merge was the problem.
Glad you figured out!