Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #25351

    I’ve tried using page id’s in the Custom CSS section

    body.page-id-16 { background-image: url(http://rockjacobs.com/sites/all/themes/basic/images/bg_RJ_contact.jpg) ;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0; }

    but it still gets taken over by the background image set in the Theme Options.

    Can you tell me how to achieve this?

    #126600

    Hey tlow87,

    Can we take a look at your site with the code live (that specific page). We should be able to see whats going on and get things back on track for you :)

    You could also try an easier route and use Peter’s (Dude) plugin that will allow you to set this per page: http://inoplugs.com/projects/wp-backgrounds-lite-version/

    Regards,

    Devin

    #126601

    Definitely: http://www.rockjacobs.com/wp

    Going to play with the plugin now. Thanks!

    #126602

    Okay, so the plugin worked for every other page but the Homepage.

    And if I set a custom background image in the Theme Options, it overrides the plugin.

    The plugin wasn’t working with the homepage, and while I’m using a dynamic template I do have post/page content included so I thought it would work, but just white.

    Any tips?

    #126603

    Try:

    body#top.home {
    background: url('yoururl') top center;
    }

    #126604

    That didn’t work, so I’ve just put this at the top of the Homepage’s content:

    <style type="text/css">body { background-image: url(http://rockjacobs.com/wp/wp-content/uploads/2013/06/bg_RJ_home1.jpg); background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;}</style>

    Hope this isn’t the dumbest way to pull this off.

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Different background images per page’ is closed to new replies.