Archived topic
Mobile menu colors (background, links, etc.)
8 replies · Started by Alexandre on March 31, 2021
How to set the mobile menu colors (background, links, etc.)?
I use your "Artisan" template.
I thank you for your answer.
Hi Alexandre,
The mobile menu colors inherit the same colors from the desktop which is set in Customizer > Colors > Primary Navigation.
Are you wanting to use different colors on mobile only?
Let me know :)
Hi Leo,
I tried but nothing happens when I change the settings in Customizer/Color/Primary Navigation...
Should I choose "by default" or "current" for the navigation color ?
I would like to have the same appearence than your demo "ARTISAN", where the navigation color for the primary navigation is White, so different from the desktop version...
Hi Alexandre,
There's no by default or current option for colors, that's under layout settings.
You can change the background color for the header of desktop and mobile at:
Customizer > colors > header.
And for desktop navigation, go to customizer > colors > primary navigation.
If you want to change the mobile header background color only, try this CSS:
#mobile-header {
background-color: #000;
}
Let me know :)
Thanks !
I understand : what you call "panneau latéral" in French is actually the mobile menu ?!
I'm not sure what "panneau latéral" means.. google translated it to sidebar.
Sidebar means "colonne latérale" in French. But I don't use a sidebar that's why I didn't have a look on this menu.
I think there is a translation mistake : "Panneau latéral" means "Menu mobile" in the french version of my WP customizer.
Thanks.
Please, how can I remove/modify the topbar of this "Artisan" template please ?
I want to remove on desktop version and only display phone number on the mobile version.
thanks a lot !
Go check appearance > widgets > top bar.
You could remove the social icons widget from it, edit the text widget directly to the phone number.
Then add this CSS to hide it on desktop:
@media (min-width: 1025px) {
.top-bar {
display: none;
}
}
Adding CSS: https://docs.generatepress.com/article/adding-css/