Amend banner size for desktop and mobile devices

17 2 2



I am using the Taste Theme to build a website, and I've added an image banner to the homepage (screenshot attached) which looks great on a desktop device, but on mobile it crops the banner and cuts off most of the icons and text. Is there any code I can add that means the banner automatically reduces in size to fit a mobile device? 


Many thanks,


Replies 3 (3)

Shopify Partner
411 45 70



I recommend that you add another banner for Mobile devices with a different design to make it appear the way you want, then we can add a small code to show the banner in accordance to the device size

If my solution helped you don't forget to accept it to help others.
And if you really like my support share a cup of coffee with me
17 2 2

Hi @Natasha-Saed - thanks for the reply. I do have another banner more suitable for a mobile device, so do you have the code needed to to show the correct banner in accordance to the device size? 


Shopify Partner
49 2 10

@liambeauchampIt would be best to add a separate banner image for the mobile. If you consider using an app (like the Posstack Easy Content Builder), then you can add separate banners for Desktop and mobile without coding.

*PS. I'm the co-creator of the app, feel free to contact me if you have any questions.

(Free!) Easy Content Builder - No-code theme sections and metaobject templates for any Shopify store. Add pre-built sections, multi-column layouts, and customize right in the Shopify theme editor.