How to change color of Navigation menu bar and footer area

Hi Santoshbchaskar

To change the footer color place the following CSS to Custom CSS which can be found in Theme Option

Dashboard >> Appearance >> Theme Options >> Styling Option >> Custom CSS

.footer-container {
   background: #B19D35;
}

To change color of menu following CSS will work.

#menu li.current-menu-item a, #menu li.current-menu-parent a, #menu li.current_page_parent a, #menu li a.selected, #menu li a:hover, #menu li.current_page_item a, #menu li.sfHover, #menu li.sfHover a {
color: #fff;
background: #B19D35;
}
#menu .sf-menu li li a.selected, #menu .sf-menu li li a:hover {
color: #FFFFFF;
background: #B73AC2;
}
#menu .sf-menu li li {
background-color: #A22083;
}

Change the color code of your interest.

I attempted this to change out the footer green color – added the code to the custom css area in theme options, but nothing changed:
.footer-container {
background: #B19D35;
}

Open your stylesheet file in the theme’s directory and go to line 49. At present you are using footer-bg.png as background. It has a green color.

If you want to change the background color, replace the code

.footer-container {
    background: url('../images/footer-bg.png') repeat scroll 0% 0% transparent;
}

with

.footer-container {
    background: #404040;
}

It will change the color to grey. I guess you don’t want this particular color so replace it with any color you want.

I am having the same problem. I tried to edit the stylesheet file, but don’t see any code that is:

.footer-container {
    background: url('../images/footer-bg.png') repeat scroll 0% 0% transparent;
}

https://norakramerdesigns.com

Printergirl, it is in wp-content/themes/colorway/style.css of your site.

So I can’t get to it by going to Dashboard >> Appearance >> Editor and choosing the style.css then? That’s where I was looking.

I am doing a search and am not finding anything that says:

.footer-container {
    background: url('../images/footer-bg.png') repeat scroll 0% 0% transparent;
}

??

You will also need to edit the green.css file found in the same directory and make changes to the code starting at line 78. This one:

.footer-navi {
    background: none repeat scroll 0% 0% #2B4908;
}

You can access the files with notepad from the theme’s directory and make changes from there. Be sure to back them up first.

Aha! Perfect. That is exactly what I was looking for! Thanks. ??

Hi pankaj064,

Thank you very much !!!

It Works

Hi guys,

I’ve been reading your posts and they’re really helpful. I’ve managed to change most of the stuff I need using CSS, but I still can’t seem to change the quote for testimonials at the bottom or the footer colour!

Is anyone able to help? What are the CSS lines to change these? Thank you!

https://chroniclescreditcard.com/

Hi,

I am trying to change the colour of the footer on the FLAT version of the COUER theme – I want it to be white and not black – I have looked at the CSS but I cannot find where I would need to change this, could anyone help me please?