WordPress.org

Ready to get started?Download WordPress

Forums

Highwind
[resolved] How to change the wallpaper background colour (12 posts)

  1. T Can
    Member
    Posted 11 months ago #

    I want to change the wallpaper/background colour to #00cd66

    I tried theme, editor, style.css found body found background and changed it to #00cd66

    But it did not change.

    http://mrsgreenjeansplantsseeds.com/ is the webpage i'm building.

  2. T Can
    Member
    Posted 11 months ago #

    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

  3. Robert Bardall
    Member
    Posted 11 months ago #

    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.

  4. T Can
    Member
    Posted 11 months ago #

    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.]

  5. T Can
    Member
    Posted 11 months ago #

    Hey - most of my previous post disappeared...

    http://mrsgreenjeansplantsseeds.com/

  6. Robert Bardall
    Member
    Posted 11 months ago #

    Ok, here's what you need to do:

    First we're going to create a child theme:

    1. Navigate to your site's theme directory (default is ../wp-content/themes/)
    2. Create a new folder in this directory and name it "highwind-child" (without the quotes of course)
    3. Create a new file in this folder called "style.css" (again, no quotes)
    4. Paste the following code into your new "style.css" file
    5. 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.

  7. T Can
    Member
    Posted 11 months ago #

    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/

  8. T Can
    Member
    Posted 11 months ago #

    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.

  9. T Can
    Member
    Posted 11 months ago #

    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 :-)

  10. T Can
    Member
    Posted 11 months ago #

    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/

  11. Robert Bardall
    Member
    Posted 11 months ago #

    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;
    }
  12. T Can
    Member
    Posted 11 months ago #

    You are awesome. Thanks.

Reply

You must log in to post.

About this Theme

About this Topic