How to include the header in a full width picture at the top of the homepage

Store Design
1

Hey everyone,

I’m trying to get the header to integrate with the first image in the homepage to get a full screen background picture experience.

Something like https://stegaru.com/ where he has a video at the top but the header is not separated from the video. I would like to achieve that with a picture.

Any help would be very appreciated.

I’m using DAWN theme

2

@py3

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

1 Like
3

Hey thanks for the reply.

Could u please check it on a mobile because it is only compitable with mobile screen for now

my store is : https://deadseapearlsuk.myshopify.com/

it is still password protected so the pass is : aaa

again thank u:)

4

@py3 ,

Please add this CSS to your theme

@media (max-width: 767px){
    .__pf .pf-5_{
        padding: unset !important;
    }
    .__pf .pf-9_, .__pf .pf-6_{
        font-weight: normal !important;
        font-family: system-ui !important;
        font-size: 16px !important;
    }
    .__pf .pf-12_{
        display: inline-block !important;
        margin: 0 0 15px 0 !important;
        border-radius: unset !important;
        color:#fff !important;
        font-family: unset !important;
    }
}

Thanks!