Xavier Jones
asked 6 years ago

How do I change the font size and thickness of the menu?

3 Answers
DominicStaff
answered 6 years ago

Hello Xavier !

To change font size of the menu, you can log in to Dashboard > Appearance > Customize > Header Code, add the following code:

 <style>
.nav-main .navbar-nav > li {
    font-size: 16px;
}
</style>

Hope this helps !

Xavier Jones
replied 6 years ago

Aha ok great, thank you! Also, how can I change the font color, style, and thickness?

Dominic Staff
replied 6 years ago

Hi,
To change the font color, style & thickness of the menu, you can add the following code to the Header Code.

Hope this helps !

Xavier Jones
replied 6 years ago

Hi. So I can’t change the color of the menu headings with this code. They stay white. Also, how can I apply the visual edits from my homepage to other pages so there is a matching design?

Charlotte Mabry
replied 6 years ago

I need to know this also

DominicStaff
answered 6 years ago

Hi Xavier ! 
Please send me your site for further checking then we will help you change the color of the menu.
– At the moment, Our DW Timeline does not yet support to apply the visual edits from my homepage to other pages.
Hope this helps !

Xavier Jones
replied 6 years ago

So how can I change the color of the menu on other pages from red? And how do I send you my site?

Dominic Staff
replied 6 years ago

Hi,
You can send me username & password of your site (via private answer).

DominicStaff
answered 6 years ago

Hi Xavier ! 
To change the menu, you can add the following code to the Header Code: 

<style>
.nav-main a {
color: #...;
}
.nav-main .navbar-nav > .active > a {
color: #....;
}
.nav-main li a:hover, .nav-main li a:active, .nav-main .active > a {
color: #...;
}
.nav-main .navbar-nav > .active > a {
color: #....;
}
.nav-main .navbar-nav > li {
font-size: 16px;
font-style: italic;
font-weight: bold;
}
.nav-main .navbar-nav ul a:hover {
color: #...;
}
.nav-main .navbar-nav > .active {
border-bottom-color: #...;
}
.nav > li > a:hover, .nav > li > a:focus {
background: #...;
}
.nav-main .navbar-nav ul a {
color: #.....;
}
.nav-main .navbar-nav ul a:hover {
color: #....;
}
.nav-main .navbar-nav ul li {
background: #.....;
}
</style>

Hope this helps ! 

Xavier Jones
replied 6 years ago

This code works only for the home page? How can I change the menu font color on the sub pages as well?

Dominic Staff
replied 6 years ago

Hi,
Please tell me detail about the position that you want to change the color, or you can send me a screenshot for further checking.
Regards,

Powered by DW Question & Answer Pro