How to make background image only appear on home and above fold?

Tagged: background, customisation, homepage, image, widgets

This topic has 5 replies, 2 voices, and was last updated 10 years, 5 months ago by Wes.

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

Author

Posts
November 1, 2013 at 11:37 am #8592
Mike
Customer
Hi All

I’m experimenting with background images in Appearance > Customisation. Instead of the uploaded image being used on every page, how can I isolate the image to only work on the homepage?

PLUS

Is there also a way to only have the image show above folder (versus remaining under all the other home feature widget sections as you scroll up the page?)

Thanks!
November 1, 2013 at 2:08 pm #8598
Wes
Moderator
Do you have a link to your site where this is active? I can take a look at everything to see if and how it can be done.
November 1, 2013 at 3:12 pm #8603
Mike
Customer
Thanks Wes. Just uploaded changes with background image. http://www.mikemetcalfe.co . Be great if possible!
November 1, 2013 at 8:09 pm #8606
Wes
Moderator
Remove the background that you added, and then try adding this to your css manually –
```
.home.custom-background {
    background-image: url('http://mikemetcalfe.co/wp-content/uploads/2013/11/homepage-221.jpg');
    background-repeat: repeat;
    background-position: top left;
    background-attachment: fixed;
}
```
For the second question, I think you could just add a white (or whatever color you want) background to that particular div/section so the background image doesn’t show up.
November 2, 2013 at 4:23 am #8630
Mike
Customer
Perfect, thanks Wes
November 2, 2013 at 11:42 am #8636
Wes
Moderator
You’re Welcome!
Author

Posts

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

The topic ‘How to make background image only appear on home and above fold?’ is closed to new replies.