Added a background image to header but it's not showing on mobile view

Cozytown
Excursionist
18 0 3

I added a background image to the header section with code and changed the height, and it's working great on desktop but on mobile view the image doesn't show at all. Is there a way to get it to work on mobile as well? See below screenshots of desktop and then how it's appearing on mobile:

 

Cozytown_0-1712270038250.png 

Cozytown_1-1712270182217.png

 

 

 

I'm using the Dawn theme

My store link is www.cozytown.store

Replies 2 (2)

PageFly-Henry
Shopify Partner
1090 312 265

Hi @Cozytown 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

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

Step 2: Search file base.css

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


header.header.header--middle-center.header--mobile-center.page-width.header--has-menu.header--has-localizations {

    background: url(/cdn/shop/files/wide_banner.png?v=1712235270) no-repeat;

    background-position: center;

    object-fit: cover;

    background-size: cover;

}

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Cozytown
Excursionist
18 0 3

Hey Henry!

 

I appreciate that but unfortunately that didn't fix it