Archived topic
Secondary navigation inside main navigation on mobile
5 replies · Started by Sofie on July 27, 2022
Hi. I have a question concerning the primary and secondary navigation. I have built a secondary menu (because I would like to add more important content to the primary menu), see http://www.capeach.eu.
Then I used the instruction on https://docs.generatepress.com/article/disable-secondary-navigation-mobile-menu/ to disable the Secondary Navigation Mobile Menu. However, I would like to insert the menu items of my secondary navigation into the primary navigation on mobile, if possible with a dividing line between the primary and secondary items.
Is that possible. If so, how?
Thanks for your reply!
Hi there,
the simplest solution would be to use the Off Canvas panel on mobile:
https://docs.generatepress.com/article/off-canvas-panel-overview/
You can then either:
a. Create a single menu that combines both primary and secondary menu items and assign it to the Off Canvas.
or
b. set it to display the Primary menu and add a Navigation Widget to the Off Canvas panel to display your secondary menu.
Hi David, thanks for your quick reply.
I have installed the Off Canvas panel on mobile and it works like a charm. However, my secondary navigation menu items are still displayed on mobile. Probably I still have to change something in the settings?
Add this CSS to remove it on mobile:
@media(max-width: 768px) {
.secondary-navigation {
display: none;
}
}
Thanks a lot, David!
You're welcome