Support » Themes and Templates » How to change Navigation bar background color?

  • I have customized the “Body Background Color” and “Main Wrapper Background Color” to my needs. But I cant see any option to change the Navigation bar background color. It is stuck to default dark gray color. So now my theme looks odd just because of the navigation bar.

    Here is the image of the problem.

    Can anybody please tell me how to change that color?

Viewing 3 replies - 1 through 3 (of 3 total)
  • See here: . Replace the parameters for “background” with the colors that you wish.

    Thanks for the quick reply Sayontan.

    I am not very good at coding. Do you mean replacing 97caff in the following code to the color that I want?

    #nav li a:hover, #nav li a:active,
        #nav a.highlighted, #nav a:active {
           background: #97caff url(url_for_the_highlighted_background_image) repeat-x top left;
        #nav ul ul a.drop:hover,
        #nav ul ul :hover > a.drop,
        #nav a:hover,
        #nav ul ul a:hover,
        #nav :hover > a,
        #nav ul ul :hover > a {
           background: #97caff url(url_for_the_regular_background_image) repeat-x top left;

    Something like that. My guess is that you want the color to be the same as your wrapper background. So for you this will suffice:

    #nav ul li a,
    #nav ul ul a,
    #nav ul ul a:visited,
    #nav ul ul a.drop,
    #nav ul ul a.drop:visited {
    	background: #f0f0f0;

    Follow the instructions for incorporating this into the theme options and replace #f0f0f0 with whatever you require.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to change Navigation bar background color?’ is closed to new replies.