Need help? Check out our Support site, then


Need help changing the background image per page.

  1. I would like to use my current background image (a picture of myself) only on the about page. Then use a different background image for the other pages on my site.

    I bought the custom design upgrade, and I have a basic understanding of CSS. However, without having access to the html files, I'm not sure how to go about applying a specific style sheet to a specific page on my site.

    Can anyone give me an example of the mark-up I should use to change the background image on the about page only?

    Thank you!

    The blog I need help with is andysarles.wordpress.com.

  2. thesacredpath
    Staff

    Add the following to your custom CSS and then go back to appearance > background and upload the other background that you want on all the other pages. The below sets the image of you as the background for the about page by targeting the specific page ID.

    .page-id-2 body {
    background-attachment: scroll;
    background-image: url("http://andysarles.files.wordpress.com/2011/07/about_background22.jpg");
    background-position: left top;
    background-repeat: no-repeat;
    }
  3. Thanks so much for the help!

    I found that with this particular theme I didn't need to include the "body" tag. So this works perfectly:

    .page-id-2 {
    background-attachment: scroll;
    background-image: url("http://andysarles.files.wordpress.com/2011/07/about_background22.jpg");
    background-position: left top;
    background-repeat: no-repeat;
    }

    Thanks again for you help!

  4. thesacredpath
    Staff

    You are welcome.

    Generally as a normal way of doing things I would suggest always including the body tag. When you go back into things later, you don't have to try and remember that this was the class for body tag on this particular page. With "body" there it is immediately obvious.

  5. thesacredpath
    Staff

    The other thing is, check in several browsers if you can to make sure they are all picking that up and displaying it correctly. IE in particular can be quite rigid in how it looks at things (which is strange give it is so far from standards compliant to begin with).

Topic Closed

This topic has been closed to new replies.

About this Topic