Thread Starter
T Can
(@t-can)
Just to clarify I want to change the far left and right background. Not behind the text on my webpage. Maybe I am calling it the wrong thing.
Thanks
You have an inline style on your main page. This is probably controlled in your admin panel > themes > customize > colors. If you change that to your green, you should then have the green showing through on the left and right.
If that doesn’t work you’ll have to find this:
body.custom-background {
background-color: #FFFFFF;
}
and either change that to:
body.custom-background {
background-color: #00cd66;
}
Or delete the inline style and change the color in your stylesheet.
That will accomplish changing your entire page background color. The far left and right are just showing your body background color. You’ll then have to change the background color of your content and menu sections to white or whatever color you prefer. Changing the background to “inner-wrap” may do this in one fell swoop. If not, you’ll have to get more granular.
Thread Starter
T Can
(@t-can)
Ok – sorry newbie here and I don’t understand what you said.
I have looked for body.custom-background and did not find it.
Here is all the background words I did find – which ones do I change.
[CSS moderated. all that is needed is a link to your site.]
Thread Starter
T Can
(@t-can)
Hey – most of my previous post disappeared…
http://mrsgreenjeansplantsseeds.com/
Ok, here’s what you need to do:
First we’re going to create a child theme:
- Navigate to your site’s theme directory (default is ../wp-content/themes/)
- Create a new folder in this directory and name it “highwind-child” (without the quotes of course)
- Create a new file in this folder called “style.css” (again, no quotes)
- Paste the following code into your new “style.css” file
- Go into your admin panel and activate the new child theme
/*
Theme Name: Highwind Child Theme
Theme URI: http://wordpress.org/themes/highwind
Description: Child theme for the Highwind Theme;
Template: highwind
Author: Mrs. Green Jeans;
Author URI: http://mrsgreenjeansplantsseeds.com/
Version: 1.0;
*/
@import url("../highwind/style.css");
body{
background-color: #00cd66 ;
}
.inner-wrap {
background-color: #ffffff;
}
As long as there are no inline styles (meaning styles that are hard-coded into the page structure)that interfere with your code, this should get you the results that you desire.
Let’s see if that is enough to override what is being called on your site. I’m not intimately familiar with the Highwind theme, but I have installed it on my test blog and the code above achieves what you desire for me. I do not have the code that I referred to in my last post appearing on my site, so I don’t know exactly where it’s coming from on yours.
Let’s see if this works for you.
Thread Starter
T Can
(@t-can)
I have a child theme template running already so I copied what you said to do and put it on the template and…..
Nope did not work.
http://mrsgreenjeansplantsseeds.com/
Thread Starter
T Can
(@t-can)
ohhhhhh sucess. After I did your code I went to appearance customize and changed the background colour there to the #00cd66 and now it is green but now I have lost my menu bar I will go find it.
Thread Starter
T Can
(@t-can)
Ok I found my menu bar but the writing on the menu bar is the same as the background now so I can’t see it.
Can you give me the code to turn the writing on the menu bar to black so I can see it.
Can I put that code on the child theme page?
I am also going to want to change the header to a picture and make that background white.
Thanks so much for you help. I am actually learning lots. Thanks 🙂
Thread Starter
T Can
(@t-can)
Ok now I’m sorry to be a pain – I went through themes customization, I have found the menu colour But it is the same as the link colour which is also the headings and header colour. Can they be a different colour. I would like the links/headings in the green. The header which is way too wide white and the menu writing black. I’m sure it is possible.
Thanks again
🙂
http://mrsgreenjeansplantsseeds.com/
In your child theme’s style.css add the following code(change the x’s to the hex code for the color of your choice):
/*Targets the main navigation menu*/
.main-nav ul.menu a {
color: #xxxxxx;
}
/*Targets the headings*/
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .heading a, .omega a, .psi a, .alpha a, .beta a, .gamma a, .delta a{
color: #xxxxxx;
}
/*Targets links that aren't otherwise targeted*/
a{
color: #xxxxxx;
}
/*Targets the header*/
.header{
background-color: #xxxxxx;
}
