• 0
Sign in to follow this  
Followers 0

Changing background image of all pages except Home Page


Question

Posted · Report post

Hi,

 

  Based on http://forum.pagelines.com/topic/30414-different-background-images-on-different-pages/.

 

  I would like to change all other pages except for the home page.

 

This is my code :

BODY.page.page-id-14.page-template-default.sophistique.pl-pro-version.responsive.full_width.last-imported-singlecolumn.display-full DIV#supersized{
 filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

   Basically if i were to do this method, there are 50 pages which i need to change. Is there another way?

 

regards

Share this post


Link to post
Share on other sites

6 answers to this question

  • 0

Posted · Report post

Hi there, the easiest way to do this would be to set the background page site wide to the image you want to use on all the other pages. So then you have that image on every page including the homepage, then using css you can override the homepage to a different image.

 

.home .site-wrap {
background: url(http://www.your-image-url.co.uk);
}

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi,

 

     The problem with using this is that it is not going to resize the image responsively as i believed pageline is using a jquery method to allow us to check the fixed image that allows responsive background.

 

    Please advise.

 

Regards

Share this post


Link to post
Share on other sites
  • 0

Posted (edited) · Report post

But that is not responsive as i need to set the size. Any other solutions?

Edited by Adrianna Lima

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi there, the easiest way to do this would be to set the background page site wide to the image you want to use on all the other pages. So then you have that image on every page including the homepage, then using css you can override the homepage to a different image.

 

.home .site-wrap {
background: url(http://www.your-image-url.co.uk);
}

ANd this method doesnt seems to work

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi there,

 

It's working on my test site, can you zap us a link to the live site so we can take a look.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0