background image for a specific page/

Hi there,

1. Which page are you wanting to add a background too ?
As your home page is using a page builder which overlays the background content, and will hide any image we add to the themes body.
For opacity you will need to change that in the original image as you cannot apply opacity to a background only to its container which will effect the content as well.

2. Can you check you have a number of widgets set:

https://docs.generatepress.com/article/footer-widgets/#global-setting

Hello David

I am trying to set a background image for the home page only. and i need to overlay transparant black color on the image so the white text can be clearly shown.

Thank you
hazem

You could do this to add the background image with a 50% opacity black overlay to the Home page body:

body.home:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(https://full_URL_TO_BACKGROUND/image.jpg);
    background-size: cover;
}

Not sure how your design is intended to be - but you will need to make any other containers with a background color transpatent as well e.g

body.home .site {
    background-color: transparent;
}

Thanks David

I don't see the post options so i can go to the style section and a dd a background image ?

I don't understand what your mean? That CSS above would add an Image that you specify in this line of the code:

background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(https://full_URL_TO_BACKGROUND/image.jpg);