How can I adjust the background image to fit the header and footer?

Store Design
1

Hello,

I am wondering if I could make the background image fill the header and footer. My website is illicitbehaviours.ca.

Thanks in advance!

2

Sorry for not mentioning this beforehand but I am using the Origin theme.

3

You can add image background for password page in store admin > Sale channels > Online store > Themes > Customize > click dropdown menu at the top > Others >Password

Screenshot 2023-04-20 at 14.49.46.png
Screenshot 2023-04-20 at 14.49.46.png1868×840 125 KB

4

Hi @Dylan444,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file section-password.css

Step 3: Paste the below code at bottom of the file → Save

#shopify-section-main-password-header{
    position: absolute;
    left: 0;
    right: 0;
    z-index: 10;
    background: transparent;
}
#shopify-section-main-password-header *{background:inherit}
#Banner-template--17351866220851__main{
height:100%
}

PageFlyRichard_0-1681977081940.png
PageFlyRichard_0-1681977081940.png2600×1814 1.17 MB

Hope my solution works perfectly for you!

Best regards,

Richard | PageFly

1 Like
5

Thank you so much! This worked but on mobile, it still does not cover the entire screen. Any fix for this?

6

Bumping @PageFly-Richard

7

Hi,

I am using the dawn theme and I have tried this but it does not seem to work. Can you help me out?

Password - GeffDoe