Archived topic
Mobile menu
11 replies · Started by Bas on March 30, 2021
Hi, I created a mobile menu with the following CSS:
add_action ( 'init', function() {
register_nav_menu( 'mobile-menu', __( 'Mobile Menu' ) );
} );
add_filter( 'generate_mobile_header_theme_location', function() {
return 'mobile-menu';
} );
The mobile menu option in Customizer -> Menu's is present and I have selected the menu items.
But the menu doesn't show in the mobile view.
How can I activate this?
Hi Bas,
Not sure if I fully understand. That code isn't CSS.
What are you trying to achieve here?
Can you link me to the page in question?
Hi Leo,
I try to achieve a separate mobile menu for my website.
I copied the code from '/docs.generatepress.com/article/using-a-different-menu-on-mobile/'
I have added it with the Code snippets plugin.
How can I link you to the page in question?
On what page should this code be? The homepage?
That code should apply to all pages so just a link to your site should do.
You can use the private info field.
Below the adress of my website
Hi Bas,
Is this your mobile menu? It seems working fine.
https://www.screencast.com/t/CPzXAS5hm
Make sure you clear your browser cache.
Let me know :)
Clearing the browser cache did the tric, thanks.
The secondary menu is also present in mobile view (see the lines in the blue zone)
How can I deactivate it in mobile view?
Try this CSS to hide secondary navigation on mobile:
@media (max-width: 768px) {
#secondary-navigation {
display: none;
}
}Can I insert it with Code Snippets?
Use the Additional CSS field in the customizer is the easiest solution.
Works!
Thanks a lot guys!
No problem :)
