Home Forums Weaver Xtreme Theme Backgrounds per page

Topic Resolution: Resolved

This topic contains 5 replies, has 2 voices, and was last updated by  scrambler 1 week ago.

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

    swmagic999
    Participant

    Is it easy enough to add a unique background per page?  Is that a normal common method for building websites?

    #48140

    scrambler
    Moderator
    #48208

    swmagic999
    Participant

    Yes, I did.  Here’ what I got closest from that document:

    .page-id-1234 #content {
    background-image:url(ImageUrl);
    }

    But I modified it per another answer you had for someone else:

    Page-id-23.custom-background { background-image: url(‘http://graphic.avwebmaster.com/wp-content/uploads/2017/04/old-lancaster-1.jpg’) !important; background-repeat: no-repeat !important; background-position: top left !important; background-attachment: fixed !important;}

    Is something in error here?

    #48210

    scrambler
    Moderator

    When a rule does not work, you must include a link to the site with the rule in place so we can check why.

    I see at least one error with a space at the beginning of the curly bracket that should  not be there (highlighted in yellow in your post above)

    If that does not fix it, post a link to the page with the rule in place

    #48331

    swmagic999
    Participant

    Tried removing space but that did not help.  Are spaces that important?  I never thought so but am open to education.

    Here’s the site: http://graphic.avebmaster.com/contatct-us

     

     

    #48335

    scrambler
    Moderator

    You had another error in your rule, which is a capital letter and a missing dot in front of the class.

    But that does not matter because the way you created the overall background cannot be overwritten by any rule.

    Right now you have the overall background set in Main options > Wrapping areas > full screen site BG image

    This places the background image on the html tag which is before the body tag where the page id class is. therefore there is no way to make a page specific selector to change the html tag css.

    Instead you need to put your background image URL in the box below that labeled “Site BG Image”, which will place it on the body tag. (If it needs tweaking post back once in place)

    Then the rule to use to override that image on  your specific page will be below (no need to re-specify all the other attributes, just the image suffice.

    body.page-id-23 {background-image: url(http://graphic.avwebmaster.com/wp-content/uploads/2017/04/old-lancaster-1.jpg);}

    The rule using the selector

    .page-id-23.custom-background

    Would be if you had set the background image using the WordPress background image setting

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

You must be logged in to reply to this topic.