Changing background colour in TwentyTen Theme

  • Resolved Herbie28

    (@herbie28)


    11 years, 7 months ago

    Hi,

    There’s been lots of queries about this before but they’ve not solved the challenge I have. I am learning about WordPress (Wp) style sheets. I am using a book called “WordPress for Dummies” by Lisa Sabin-Wilson. She uses the Wp 2010 theme as a work horse. On page 290 edition 3 (it’s OK I will explain) basically says go to style.css and change the following CSS selector statement….
    body{
    background: #f1f1f1;
    }

    So I changed it to blue or #0000ff;
    Nothing changes.
    Yes I have noted to flush the cache; hit Ctrl-F5 etc etc; restarted my PC and used another browser but alas no change.

    Yes I know I can go to <Appearance><Background> and change the colour there for those that are about to pounce on me for doing something so basic.

    To that end though I did do this and changed the color to blue (ie #0000ff under <Appearance><Background>. I saved this and checked to ensure this was the case when I “visited” the site (which by the way is set up on my local WAMP host. It was indeed blue and whenever I go into the <Appearance><Background> menu again & again afterward, it remains … you guessed it BLUE. Despite this, the background color statement in the 2010 style sheet (style.css) remains stubbornly #f1f1f1 as above (after I had reset it back to the default after the first edit attempt BTW).

    That is it remains the default statement …

    body{
    background: #f1f1f1;
    }

    So clearly the background color is not stored there.

    Yes … I am prepared to believe that there is some over-riding style sheet or bit of PHP code somewhere that resets the color.

    So to that end I did a global search in the entire WAMP directory which includes the WWW where the Wp themes etc are stored, for the string 0000ff or ‘#0000ff’ after I had changed the color via the <Appearance><Background> menu to blue (ie #0000ff). I have specifically looked at all the style sheets in the 2010 theme and searched for ‘0000ff’ BTW.

    Can’t find it. Yes there are small java script files there that have this buried in the code but it’s not relevant to this (besides the ‘modification’ date has not changed anyway.) Where is this stored?? Is it stored in the SQL database or something and dragged in to some code elsewhere??

    I would rather not have responses that say “just use the <Appearance><Background> menu cos it works. I am doing this as a learning exercise about tweaking themes OK?

    Thanx

Viewing 4 replies - 1 through 4 (of 4 total)

  • Are you using Firebug to work with CSS? It should show you what’s going on with it. Have you validated your CSS to make sure you don’t have errors?

    A bit more info – yes, custom background settings are saved in the database for that theme – they are not made in the CSS file. So once you have a custom background – you can see it in Firebug like so:

    body.custom-background {
    background-color: #1E73BE;
}

    That style will take precedence over

    body {
   background: #f1f1f1;
}

    because it’s more specific CSS.

    To get around that, try using this in your style.css file:

    body{
background: red !important;
}

    Also, if you have not already, be sure to look up Child Themes – as that’s the best way to make changes to theme files (i.e. style.css or .php files) – otherwise all of your changes will be overwritten when the themes is updated. In the case of default themes, that happens when WP is updated – so not a good way to go. I know you are just learning, but just wanted to you to be aware of this if you are working on a “real” site.

    Thread Starter Herbie28

    (@herbie28)

    Thanx WPyogi for your quick and helpful response. This exercise has been valuable for me.

    I was unaware of Firebug and have since loaded it in Chrome and will use it in future. I can see now where the code is being pulled from and have satisfied myself that, indeed as you say, the color is held in SQL’s “wp-options” table.

    I have taken on board your recommendations about Child themes also.

    I need to learn a lot more obviously but this has satisfied my curiosity and dealt with my trainer wheel frustrations!

    I can only assume the “table driven” versus “style sheet driven” color parameter change must have been part of a version enhancement since this book was published in 2010. I can’t imagine this author (Sabin-Wilson) would have made such an obvious faux-pas otherwise. But what would I know??

    Thanx once again & best regards.

    Yes, I think the custom background option was added since then. And you are right that she’s very good, as is that book. That’s one problem with books (actually anything really for that matter – though online stuff is easier to update – assuming someone does it). Personally, I also like books, but you just have to take them with the “maybe outdated grain of salt.” And then do what you did and ask :)!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Changing background colour in TwentyTen Theme’ is closed to new replies.