Two different product pictures for phone and computer

[YounesTimitar]

Hello,

Is it possible to have 2 different product photos, one for phone and one for computer?

[DP_Development]

Yes, its a little bit tricky, but possible. There are several ways to achieve this.

I suppose that the picture for mobile view is one of the product pictures, but maybe not the first one. Lets say the mobile pic is ALWAYS the second product image. You could iterate through the product pictures in your product template and use the second pic as the current product picture, if you are in your mobile view, and if not, then the regular featured image. 

You could also add an alt tag to the picture, which has to be shown as the product image in the mobile view (i.e. "mobile_product_pic"). Then you could iterate through the product picture alt tags, and use the image with the specific alt tag as a product image. 

Would that solve your issue?

[YounesTimitar]

I don't want the mobile product photo to be shown on the computer and the computer product photo to be shown on mobile. It's basically the same picture for mobile and computer but when I have a big picture it's perfect for mobile but way too big for computer. So that's why I want different pictures for mobile and computer, to have one big photo for mobile and on smaller photo fore computer. So is it possible to have a different photos for mobile and computer without showing the other on the other device?

[DP_Development]

Yes, of course its possible.

You can find all you need here: https://community.shopify.com/c/shopify-design/different-images-for-mobile-than-desktop-web/td-p/522...