Resizing images when changing view from desktop to mobile

[Bart87]

Hi all,

I am happy with my images on Desktop view, but when I go to Mobile view,.. they look horrible.

On Mobile version you can see only middle part of image..

Can I  resize the image only for Mobile version only  OR  replace images only for mobile view (which will be design smaller only for mobile version and can be different than shown on Desktop view).

Either one of those solutions will be great (but the second one will be more prefer).

Thank you for your help and time !

[PageFly-Richard]

Hi @Bart87 

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

you can set the picture on two devices here

Hope you find my answer helpful!

Best regards,

Richard | PageFly

[Bart87]

Hi, thank you for help but I ask for something different..

My question is... Can I have 2 different pictures - one on desktop and one the mobile view.

ex. main header picture on desktop will be apple, but on mobile view will be pear..

Thank you again.

[PageFly-Richard]

yes you can do that, you can first contact the theme you are using to ask for support about this, you can also use the code with the keyword "@media" to be able to set up the screen element and finally, you can do this easily by use building page app because they have these functions available.

[Bart87]

Hi Richard,

Is not about changing view, but about setting different pictures on each platform.
Ex Phone black background , PC white background

Simple

[andutzu]

many years later and after I had the same issue, I used SEOant was good but still had the problem for a few products. After some coding and other bits. the solution for me was to go to: Online Store -> Theme-> Customise -> Select Mobile view, and for the product that I had the issue with, I selected Constrain media to screen height and "Media fit ->Original"