WordPress.org

Forums

Set background image for body of main page only (11 posts)

  1. dtacke
    Member
    Posted 2 years ago #

    Hi. I am trying to set up code in the stylesheet for the 2011 theme so that a background image will appear in the body of the main page only. So far what I have is like this:

    /* Profile page-id-1 */
    body.page-id-1.main {background-image: url(http://milwproduc.com/wp-content/uploads/2012/11/mmp_ghost_shadow.jpg) repeat}

    I have seen some good examples on this forum and elswhere, but nothing I have tried to adapt has worked. I am still fairly new to WordPress, so please bear with me.

  2. deepbevel
    Member
    Posted 2 years ago #

    try

    .page-id-1
    {
    background-image: url(http://milwproduc.com/wp-content/uploads/2012/11/mmp_ghost_shadow.jpg);
    }
  3. dtacke
    Member
    Posted 2 years ago #

    Thank you for the input. I am afraid that so far, no luck.

  4. deepbevel
    Member
    Posted 2 years ago #

    I think this only works for static pages.
    try:

    .home

    or

    .blog

    instead of .page-id

  5. alchymyth
    Forum Moderator
    Posted 2 years ago #

    the 'main page' (whatever you associate with that) of Twenty Eleven might have the body_class of .home

    http://codex.wordpress.org/Function_Reference/body_class

    don't guess
    - use a browser inspection tool (such as Firebug) to find out which css classes are present in the body tag,
    - or look into the html code of that 'main page' in the browser, and look for the css classes in the body tag.

  6. deepbevel
    Member
    Posted 2 years ago #

    otherwise please post a link, I can look at it in firebug.

  7. deepbevel
    Member
    Posted 2 years ago #

    also, be aware that the sytax is wrong in your original code sample, ..the types of brackets, colin, semi-colon, ect. Mke sure that's correct or nothing will work right.

  8. dtacke
    Member
    Posted 2 years ago #

    OK, that did something. The background for the home page is changed, while for the others it is intact. How do I set it so that the background image shows up in/on the body of the page?

  9. alchymyth
    Forum Moderator
    Posted 2 years ago #

    so that the background image shows up in/on the body of the page?

    you might be referring to the container with the css id #page;

    i.e. try:

    .home #page { background-image: ... }

    results might be unexpected as the theme is flexible, i.e. changes width for small browsers.

  10. deepbevel
    Member
    Posted 2 years ago #

    without seeing it, hard to know for sure. Otherwise you can just try different body class selectors, check Sweeper's link for that.

  11. dtacke
    Member
    Posted 2 years ago #

    YES! Thank you!

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.