WordPress.org

Ready to get started?Download WordPress

Forums

Clean Home Theme - Adding Background graphic url? (11 posts)

  1. johnmk
    Member
    Posted 3 years ago #

    Hi,

    I'm using the Clean Home theme. I would like to add a graphic background to my website. When I add a background:url() css code to the body section of the stylesheet, the background image covers the entire page - including the fixed with center column. How can I adjust this so that the main site pages appear to be layered over the background image?

    Thanks.. if this has been discussed in another thread, please forward along a link.

    Much appreciated, John

  2. esmi
    Theme Diva & Forum Moderator
    Posted 3 years ago #

    There are thousands of WordPress themes - which means that many people won't be familiar with your particular theme. So a link to your site where people can see the theme might result in more responses.

  3. johnmk
    Member
    Posted 3 years ago #

    Sure, this is an example of the theme in use: http://midmodesign.com/

    How would I get a background to wrap around/underneath the content in the center of the screen?

  4. esmi
    Theme Diva & Forum Moderator
    Posted 3 years ago #

    Simply add a background image to the body element. If you theme supports custom backgrounds, you should be able to upload and position your background image via Appearance/Background.

  5. johnmk
    Member
    Posted 3 years ago #

    I have tried what you suggested before. Here is what it ends up looking like... http://sonicflurry.com/

  6. esmi
    Theme Diva & Forum Moderator
    Posted 3 years ago #

    Now you need to add a background color to #header, #blurb, content, #sidebar and #footer. Something like:

    #header,#blurb,content,#sidebar,#footer {background:#fff;}

    added to the bottom of your stylesheet should do it.

  7. johnmk
    Member
    Posted 3 years ago #

    Thank you. I'm so close!

    Two more things.. How would I give everything a little more padding to the left? And What about that piece between the #content and the #sidebar (not to mention the rest of the sidebar all the way down to the footer)?

    http://sonicflurry.com/

    Thanks so much for your help so far!!

  8. esmi
    Theme Diva & Forum Moderator
    Posted 3 years ago #

    Again, you'll need to add padding to each of the page elements as listed above:

    #header,#blurb,content,#sidebar,#footer {padding:0 0 0 10px;}

    It's not an easy theme to style en-bloc as just about every major page element is floated left!

  9. johnmk
    Member
    Posted 3 years ago #

    You're amazing! Thank you once again.. my programming skills are slowly coming back to me. Any chance I'd be able to move everything up to the top of the window to get rid of the background color above the header?

    http://sonicflurry.com/

  10. esmi
    Theme Diva & Forum Moderator
    Posted 3 years ago #

    Edit style.css & change:

    #wrapper {
    margin:40px auto;
    width:900px;
    }

    to something like:

    #wrapper {
    margin:0 auto 40px;
    width:900px;
    }
  11. johnmk
    Member
    Posted 3 years ago #

    Hmm. Can't seem to get it to work.

Topic Closed

This topic has been closed to new replies.

About this Topic