Front page background


I would like a background picture on my static front page only. I have tried various options with CSS but I am still getting the image on the other pages which I just want a background colour on. Can you advise? Thanks.

Hi, Is there no solution to this?

Hello there,

I hope you are doing well today.

You can add the “.home” selector to the code which will only have the code appear on the home page. It would look something like this:

/*Example CSS*/
.home .container {
background-color: red;

Best Regards,

Thanks for your reply. Sorry, that didn’t work, I am maybe not explaining myself very well. The website URL is

I am looking to keep the photo on the front page, but would like all other pages with a white background. So far I only have a contact page, I managed to get the background white, (minus a bar along the top) but also when you submit a message on the Contact Page it still shows the photo below.

Hello there,

Thanks for providing that information.

You can use the following CSS code to remove the background from the other pages by going to Appearance > Customize > Additional CSS and pasting it there.

body.custom-background {
    background-image: none;

.home body.custom-background {
    background-image: url(;
    background-position: left top;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;


Best Regards,

I am trying this on my website but I am not getting the image on the home Page.

am i missing anything ?



May I know where exactly you want to have that bg image? please note your website is full width and it has different sections, this means you cant apply one image for the whole body,


Hi thanks for the response. I would like to have the image show only on the home page here -

on all the other pages I just want a white background.

Thank you