Have your say in Community Polls: What was/is your greatest motivation to start your own business?
Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

Re: Need smaller pictures in mobile than on desktop version

Need smaller pictures in mobile than on desktop version

toni99
Visitor
1 0 0

Hello dear community,
I need help for my slideshows on my site. The pictures need to be smaller on the mobile site. I also tried changes in the theme.scss.liquid but it didn't work. 
My url is www.pestsystems.de

Thank you.

Reply 1 (1)

YaketyMatt
Shopify Partner
33 0 3

Hi Toni,

 

From what you have said it sounds like you would need to use the "picture" HTML element to display the images:

<picture>
   <source 
      media="(min-width: 650px)"
      srcset="images/img1.png">
   <source 
      media="(min-width: 465px)"
      srcset="images/img2.png">
   <img src="images/img-default.png" 
   alt="a cute kitten">
</picture>

 

Matthew Anderson | Shopify Expert | +44 20 3920 8081 |  support@yakety.co.uk |  https://yakety.co.uk | Facebook | Twitter | Instagram