How/Where to Change Theme's Color

Hello,

I've read past threads from others who request information on changing their site's color to a unique hue but am unable to follow the process.

My site currently uses Infoway Pro's blue color theme. I wish to change all of the blue to a teal color, #33ccc.

Exactly where is the change made, and what is the coding? From what I've read, it seems that the CSS area within the Styling Options page is the correct area. However, I don't know if this is correct and what to type wherever the change is done. Also, I am a long-time website creator but not very code knowledgeable.

Thank you in advance for assisting me.

Shirley

 

Hello,

Go to color > blue.css present in your theme directory and follow the instruction as shown in image given below

 

Thanks so much for your assistance.

I finally found the blue.css file through FileZilla and made changes.

I performed a global search for the #0aa8e4 (blue) color, as shown on line 2 in the diagram, and found that the change to add color #33cccc was completed in only two places - in a very small portion within the bottom of the top info bar (so small it's difficult to see), and in the navigation bar above the slider.

The mock site I am working on, http://www.GiftBasketCourse.com/, shows where the two color changes were made according to your directions.

I would like the color change from blue to teal to appear globally on the site, from the header to the footer. How can I achieve this?

Thank you,

Shirley

 

Hello,

Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

#topinfobox {
background: #33cccc;
}
.topinfobar .siteinfourl p {
background-color: #33cccc;
}
.feturebox .featurebox_inner .featurebox_desc .readmore {
-webkit-box-shadow: 1px 1px 1px #33cccc;
-moz-box-shadow: 1px 1px 1px #6cc1e1;
border: solid #33cccc 1px;
background: #33cccc;
}
.footer-bottom{background: #33cccc;
}
.footer{background: #33cccc!important;
}

 

I appreciate your response. This solves my question and also shows me where to amend the color before launching the site.