Raphael theme - How to enable rich drop down menu?

#1
Hello, I am working on transitioning my site from the Dali theme to the Raphael theme, but can't find where the options are to create a rich sub-menu from the main navigation. How do I go about building that?

Second question, how can I center the main nav (and utility nav)?

1559167749299.png
 

Ekaterina Sayapina

Administrator
Staff member
#2
Hello, I am working on transitioning my site from the Dali theme to the Raphael theme, but can't find where the options are to create a rich sub-menu from the main navigation. How do I go about building that?

Second question, how can I center the main nav (and utility nav)?

View attachment 9228
Hello,

You can manage your menus in WP => Appearance => Menus. Add your product categories and check Category menu in Display location. You can learn more in this guide. These are the only category-related settings.
 
#3
Thank you! That guide is helpful. Two things I'd like to adjust, but that aren't mentioned in the guide:

1. how can I center or justify the menu items like in the theme demo? The menu items spread out across the full margins of the site instead of being left-justified. I want to do the same.

2. How can I edit the 'Subscribe to our Newsletter" block that's by default on the homepage? It's not in the general customization settings.

Thanks!
 

Mar

Moderator
#4
how can I center or justify the menu items like in the theme demo? The menu items spread out across the full margins of the site instead of being left-justified. I want to do the same.
Not everything is in the guide. You need to add CSS codes to get what you want.
 

Ekaterina Sayapina

Administrator
Staff member
#8
Hello,

Please add these pieces of code to Customization => Head:

For Top Menu:
.desktop-top-panel .top-right, .desktop-top-panel>div {
justify-content: center;
}

For the Main menu bar:
.categories-menu-line{
display: flex;
justify-content: center;
}

For the drop-down menu:
.box-menu .menu>ul>li {
text-align: center;
}
 
#9
Hello,

Please add these pieces of code to Customization => Head:

For Top Menu:
.desktop-top-panel .top-right, .desktop-top-panel>div {
justify-content: center;
}

For the Main menu bar:
.categories-menu-line{
display: flex;
justify-content: center;
}

For the drop-down menu:
.box-menu .menu>ul>li {
text-align: center;
}
I added that to the CSS part of Customization >> Head and nothing changed. Any other ideas?
 
Top