Hi there,
add this
.top-bar {
justify-content: flex-end;
}
in your custom css box to align it on the right
Let me know if this helps
Worked like a charm, thanks! 🙂
I have one more question: it disappears on screen sizes smaller than 991px – is there a way to keep it there too?
Hi there,
try this
.top-bar.mobile-empty {
display: flex;
}
in your custom css box
Let me know if this helps
Hi @markwaregr,
Thanks, it worked, but I don’t like the look of a top menu in mobile view (maybe that’s the reason it’s automatically taken out in this theme..).
Is there any way to add either a main menu item or a footer menu item that will be visible only in mobile view?
Have a great day!
Hi,
yes you can add a menu item with a custom class (https://www.wpbeginner.com/wp-themes/how-to-style-wordpress-navigation-menus/)
Then add this
@media(min-width:767px){
.your-class{
display:none;
}
}
in your custom css box to hide it in desktop
Let me know if this helps
Hmmm I must be doing something wrong. Thanks for the link. Since it’s about styling a menu and I’m not looking to style a menu, but only one item (let’s call this item ‘Tuesday’), I didn’t follow it exactly.
Here is what I did:
I added to the Custom CSS in WP:
.navigation-mobile-only a {
}
@media (min-width:767px) {
.navigation-mobile-only {
display:none;
}
}`
Then under ‘Appearance -> Menus’ I added ‘Tuesday’ to the main menu and under Tuesday’s ‘CSS Classes (optional)’ I added ‘navigation-mobile-only’.
I played with the color of the class ‘navigation-mobile-only’ just to check if it’s working, and indeed only ‘Tuesday’ changed color (the rest of the menu stayed black). But ‘Tuesday’ didn’t disappear from the desktop screen (larger than 767px) :-/
What am I missing?
Thanks a lot!
Hi,
Use this
@media(min-width:767px) {
.navigation-mobile-only {
display:none!important;
}
}
instead,before any other custom css you have
Let me know if this helps
Awesome, it worked, so simple 🙂
Thanks a lot for all your support!
