Dawn Theme Mobile banner zooms in when fixed to background

Dawn Theme Mobile banner zooms in when fixed to background

rlhs
New Member
10 0 0

Hello

 

Can someone kindly help me, I've looked everywhere for an answer to fix this issue 😕

 

I am currently using the Dawn theme. I have an image where when on desktop, if I leave the image behaviour to none it works well but if I change it it zooms in. I'm wanting to fix the banner to the background but when I do so the image zooms in on both the desktop and the mobile. Is there a way to get it to not zoom in? I tried the image with different dimensions and can't figure out a fix for it.

 

This is when the image behaviour is set to none.

rlhs_0-1700087341292.png

rlhs_1-1700087371820.png

 

And this is when it's set as "fixed background position"

 

rlhs_2-1700087532428.pngrlhs_3-1700087553784.png

 

Replies 17 (17)

Dan-From-Ryviu
Shopify Partner
9668 1936 1971

Hi @rlhs 

Could you share your store link? 

- Helpful? Like and Accept solution! Support me! Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

rlhs
New Member
10 0 0

Hello it's https://kireikosmetics.com/collections/makeup

the password is usuwah

thank you 

Dan-From-Ryviu
Shopify Partner
9668 1936 1971

Hi @rlhs I cannot see that banner

- Helpful? Like and Accept solution! Support me! Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

rlhs
New Member
10 0 0
Dan-From-Ryviu
Shopify Partner
9668 1936 1971

Hi @rlhs 

Please try to uncheck this option in your Image banner section and then check again

Screenshot 2023-11-16 at 09.29.19.png

- Helpful? Like and Accept solution! Support me! Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

rlhs
New Member
10 0 0

rlhs_0-1700107465282.png

I just tried it, but it's still zoomed in

Dan-From-Ryviu
Shopify Partner
9668 1936 1971

Please uncheck that option, save your changes so I can check

- Helpful? Like and Accept solution! Support me! Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

rlhs
New Member
10 0 0

Yep It's done, It's unticked and saved

Made4uo-Ribe
Shopify Partner
8339 1998 2458

Hi @rlhs 

 

I do see what you mean.  I would suggest creating a section for desktop and a section for mobile. Set the desktop image behavior to none, and you can set the mobile to zoom. You can follow the tutorial video below. 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.
rlhs
New Member
10 0 0

Thank you, I gave it a try but even when I do a mobile section only after adding the codes in the video, the images still zoom in when I change the image behaviour to "fixed background position :,(

Made4uo-Ribe
Shopify Partner
8339 1998 2458

You might have to provide a different image size appropriate for mobile. Mobile usually looks good on portrait size images and not landscape

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.
rlhs
New Member
10 0 0

I have tried different dimensions, both landscape and portrait and both zoom in on desktop and mobile. 

Made4uo-Ribe
Shopify Partner
8339 1998 2458

Sorry. I do not see the banner in your website, https://kireikosmetics.com/collections/makeup. Is it on different link?

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.
rlhs
New Member
10 0 0
Made4uo-Ribe
Shopify Partner
8339 1998 2458

I see the issue. It is a collection banner. Sorry, I thought it was an image banner. The theme only offers one photo to show that is use for desktop and mobile. You can have another photo added but, but you have to have someone write this for you since the solution is a little complex. 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.
rlhs
New Member
10 0 0

The banner is an image in a collections page, so that can't be done?

Made4uo-Ribe
Shopify Partner
8339 1998 2458

With your current settings, I cannot find a way to do it. But with the help of a custom code, it can be done. Someone has to add a new code for you to have another image for mobile. 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.