WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] how to change ececec background? (9 posts)

  1. rethinkclaudine
    Member
    Posted 7 years ago #

    Hi - I really want to change the background color of my theme - fspring widgets. Love it, just want to change the background. I've looked at all the possible places to figure out how but can't seem to change the key code. I think it's this in the stylesheet:

    body {
    margin: 0px;
    padding: 0px;
    background: #ececec url(images/bg.png) repeat-y center;
    color: #666;
    font: 11px/15px Verdana, Arial, Helvetica, sans-serif;
    }

    I've tried to replace the background with other color names (like FFCC00) but nothing changes. And I've successfully modified a few other things in the stylesheet so I know I can do some things. But I'm fairly new to all this.

    Thanks for the help.

  2. tomizzoorg
    Member
    Posted 7 years ago #

    the ececec is the gray on the sides of your blog, and the border/white in the middle of the page is an image. I was able to create a makeshift page with that background styling and was able to change the hex codes to black.

    I'm not exactly sure what you want to change, the white or the gray...

  3. rethinkclaudine
    Member
    Posted 7 years ago #

    Thank you for the clarification.

    I want to change the gray - to something more colorful than white or black (like a light orange)

    I did leave the image alone when I tried to change the hex codes but perhaps I'm using the wrong codes.

  4. tomizzoorg
    Member
    Posted 7 years ago #

    I just entered a simple black code:

    body {
    margin: 0px;
    padding: 0px;
    background: #000000 url(images/bg.png) repeat-y center;
    color: #666;
    font: 11px/15px Verdana, Arial, Helvetica, sans-serif;
    }

    This code may or may not cause problems, it's not the format I was taught or use, however it seemed to work just fine in IE for me. what browser are you using?

    p.s. make sure your codes have a "#", and i'd start by using a familiar code (like black or red), to make sure that the codes work (or dont)..if that doesnt work, try this code (one that i'd use):

    body{
    margin:0px;
    padding:0px;
    background-image:url('images/bg.png');
    background-position:center;
    background-repeat:repeat-y;
    background-color:#000000;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:11px; OR font-size:15px;
    color:#666;}

  5. Vince2006
    Member
    Posted 7 years ago #

    Do you want just the color #ffcc00 as the background? If so don't call the url (images/bg.png) part in your style sheet.

    Try this:

    body {
    margin: 0px;
    padding: 0px;
    background: #ffcc00;
    color: #666;
    font: 11px/15px Verdana, Arial, Helvetica, sans-serif;
    }

    All I did here was remove the call to the image file bg.png that actually sits OVER the background color you are trying to specify. You'd keep seeing the image as a background so it would look unchanged since it keeps looking at bg.png and there for displays an image file as the background.

    You can change the background color to whatever works in my example by changing the value of #ffcc00 to whatever you want - for instance red would be #ff0000 or white could be #fff or #ffffff or simply white with no preceeding '#' sign as in:


    body {
    margin: 0px;
    padding: 0px;
    background: white;
    color: #666;
    font: 11px/15px Verdana, Arial, Helvetica, sans-serif;

  6. rethinkclaudine
    Member
    Posted 7 years ago #

    It worked! I tried it both ways with a simple code like black so now it'll just be finding another color that also works.

    Thank you so much.

    PS I'm on Firefox but that's good to know it works in IE too.

  7. tomizzoorg
    Member
    Posted 7 years ago #


  8. rethinkclaudine
    Member
    Posted 7 years ago #

    Thank you for the last idea too.

    I will see about making this another option as well since the background image still includes the grey borders.

  9. Crossroadsadmin
    Member
    Posted 7 years ago #

    This post has helped me a lot... thanks!

    What if I'd like to have a repeating image (or tiled image) behind the bg.png? Seems like this would be as simple as replacing the #000000 or whatever solid color with a repeating image. Anyone have ideas on how to do that in fSpring Widgets theme?

Topic Closed

This topic has been closed to new replies.

About this Topic