Resize 'image with text overlay' for mobile. Debut Theme

Solved
KetanKumar
Shopify Partner
17311 1873 6470

@Effielah23 

it's my pleasure to help us

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
chelsea1powell
Tourist
4 0 1

Hi,

 

I am having this same issue but that code is not working for me. It is my banner photo that I need to resize so it shows properly on mobile. My website is below.

www.sonnyboyco.com

 

Can you help? Thank you

KetanKumar
Shopify Partner
17311 1873 6470

@chelsea1powell 

thanks for post 

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media only screen and (max-width: 749px) {
#shopify-section-hero-1 .hero--large {
height: 170px;
    background-size: contain;
}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
chelsea1powell
Tourist
4 0 1

Hi! Thank you for your help. It solved some of the problem but now I have two white bars on the left and right side of the banner image on mobile. See screenshot below.

Screen Shot 2021-04-19 at 3.21.31 PM.png

Can you help me fix this?

Thank you!

0 Likes
KetanKumar
Shopify Partner
17311 1873 6470

@chelsea1powell 

its was depend on mobile aspect ration upload bigger size or customization mobile and desktop different image 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes