Shopify themes, liquid, logos, and UX
Image on the banner is not automatically adjusted for mobile view..
How do I make them look like one on the desktop view?
Thank you
Solved! Go to the solution
This is an accepted solution.
Hello @blushme,
1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file
@media only screen and (max-width: 980px) { #shopify-section-slideshow .hero { height:auto; } }
Hi @blushme
This can be achieved by making a separate setting for mobile and desktop ! For better assistance PM me.
Hi Qualitycheck! I am also having the issue where my 'Image with text' banners are being cut off in mobile mode. Im using the Debut theme. I tried pasting the code that was mentioned for Blushme with no luck. Any chance you can help?
Mobile mode.
Hi, I am also having the issue where my 'Image with text' banners are being cut off in mobile mode. Im using the Debut theme. I tried pasting the code that was mentioned for Blushme with no luck. Any chance you can help?
Selecting Adapt Image Height works!! Under Image Height is where you can select this. I'm using the Debut theme, and my banner is perfect on desktop and mobile.
Hi I am having the same problem with my site can you help me adjust the header to my mobile version? Thank you so much!
https://futureforclimate.myshopify.com/
how do you make a separate meeting for the mobile and desktop? I am having the same issue.
This is an accepted solution.
Hello @blushme,
1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file
@media only screen and (max-width: 980px) { #shopify-section-slideshow .hero { height:auto; } }
Thank you so much.. 😉
Hi I am having the same issue and my banner is viewing as very zoomed in on the mobile version. I tried to use this code but it is still not displaying properly.
The theme I am using is Debut.
Is there a new code to use?
Hello @thebod,
Can youplease share your site url
Thank you! The site is https://the-bod.com/
It is happening with the banner at the top and also at the bottom.
YOU ARE THE GOAT!
Im having the same problem but for Desktop version.. Any advice?
Hi TroWul.
Use the app COLLECTION SLIDE SHOW - https://apps.shopify.com/collection-slideshow?surface_detail=collection+slideshow&surface_inter_posi...
Mine solved it like this!
Hope this helps!
Hi all,
I am facing a similar issue, but with my email format. When I include pictures in the email, it keeps the email from auto-adjusting for mobile. Any recommendations on how to work through this issue would be appreciated!
Hey,
I am having the same problem as well, however the code you provided where you have to insert asset>theme.scss, I don't have that file name instead its theme.js. What should I do?
Thanks!
Hi,
I pasted this code but it still doesn't work for me. The image on the mobile version is zoomed in and not in full size. Any idea how to solve it?
It worked Tku
Hi, I am trying to format my banner to be the correct width on my mobile site as it is on my desktop site. I tried the code solution above but it didn't solve the problem. I am using the Debut theme. Any advice?
I do not have the section theme.scss.liquid to add this code. Is there another way?
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024