Centre logo and primary menu

Hi,

I’m looking to centre our travel blog logo with the main menu underneath (in both desktop & mobile).
Can you let me know if this is possible?

Site URL: https://witragtravel.com/

Thanks a million in advance,
Emma

Hi there

Hope you are having a good day and thank you for your question
Dear Emma sorry but this is not possible, there is no such option in the theme to center logo and menu under it, this will require customization of the template

Thanks!
Colorlib Support Team

If this is important for you as a blogger/traveler I can do an extra job for you by creating this custom css for you, let me know :slight_smile:

Hi Noda,

Thanks for the quick response, appreciate it :slight_smile:
Ah ok, I thought I had seen on other threads within the shapely support forum that it had been resolved with custom css. If this is something you could provide for us that would be great.

Thank you again!
Emma

Good evening Emma

this will take some time but let’s try and lets start from this portion of the text :slight_smile:
add this css codes in appearance >customize > additional css:

#site-navigation .module.left {
float: none !important;
width: 100%;
}
.module.right, .module-group.right {
float: none;
width: 100%;
}
.module.widget-handle.search-widget-handle {
position: absolute;
}
#site-navigation .container>.flex-row {
display: block;
}
.main-navigation a img {
display: block;
margin: 0 auto;
}
.main-navigation .menu>li {
float: none;
position: relative;
display: inline-block;
}

Please note, we have a day off on weekends and you may add this code on Sunday, i will check it on Monday morning

Hi Noda,

Thank you!
I have added in this custom CSS, and the logo is now indeed centred. The nav menu is sitting off to the left (i’ve attached screenshot). Can you let me know what I need to add/amend in order to centre this?

Thanks again for all your help!

Emma

Good morning

We are almost there :slight_smile:
let’s add these codes now:

.navbar-collapse {
text-align: center;
}
.module.widget-handle.search-widget-handle {
right: 0px;
bottom: 0px;
}

Hi Noda,

Perfect - this has worked!

Thank you for your help :slight_smile:

Emma

Dear Emma thank you too :slight_smile:

If you’re happy with our service, don’t forget to rate us: [Illdy] Reviews | WordPress.org