[Hans]

Hi,

Is it possible to make a home page with a picture as background for a transparent page. The final result is a picture with text on it and no more on that page. Also no footer.
In the mean time I learned how to make the footer transparent. I failed making an page transparant so that the text stays visible.

Kind regards

Hans Hagmeijer

[sapana]

@toerfiets:Go to=> Appearance=> Customize=> Additional CSS and Add following CSS code.

body.custom-background {
    background:url("https://media.istockphoto.com/photos/hexagonal-abstract-3d-background-picture-id486421008");
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center;
}
.site-main {
    background:none;
}
.site-content .wrapper  {
    background:none;
    border-bottom:none;
}
#featured-content {
    background:none !important;
}

You can change the background image Url as per your requirement.
Kind Regards,
Sapana

[Hans]

Thank you Sapana,

I will try this and let you know the result.

Kind regards

Hans Hagmeijer

[Hans]

Hi Sapana,

Thank you for answering. I tried this. It has a good result if I use an URL (like you did).
It has no result if I try to use one of the pictures of the media library.
Can you explain please which data I have to input from the media library to het the good result?

Kind regards

Hans Hagmeijer

[Hans]

HI Sapana,
Another question. After I input the code not only the front page has an opacity, but all the pages. It should be only the front page with image as background. The other pages have to stay withe.

Kind regards

Hans Hagmeijer

[Hans]

Hi Sapana,

I solved the problem by adding: .home to additional CSS.

Kind regards

Hans Hagmeijer

[sapana]

@toerfiets: Glad to know that you figure it out!
Kind Regards,
Sapana

[Author]

Posts