How do I set a background image that extends under the header on my home page?

Hello, I am starting a new brand and I’ve been trying to figure out what I want for design. I have been looking at some other brands with amazing websites, and I would like to re-create something similar.

However, they have in common a full-size background picture as their first picture on their home page, which is extended under their transparent header. I need help finding what I need exactly and what I’ve tried doesn’t seem to work.

Does anyone know how I can do this, It would greatly help me.

Thank you very much.

  • BB
1 Like

Hi @BoudewijnB

It needs to be a transparent header so the banner will be the background of the header. We can achieve that with a simple CSS code. However, when you scroll down the homepage, the text color might not blend well and could contrast poorly. Alternatively, you can set the header to be non-sticky. If you agree with this you can share your store URL. Thanks!

Hello,

I have my header set to transparent already. However, the issue now is I cant seem to get my image to cover the entire page. I just cuts off at some point and that makes it look terrible. Example websites of what I am talking about is: https://rh-ude.com/ and https://eu.representclo.com/

Thank you for your quick reply.