Hi everyone! I’ve set the size of my product images to “medium” on the product page and it all looks good on desktop. But I think it’s a little too big on mobile and would like to make it smaller on just mobiles. The “small” alternative would suit better on mobile, or if it is possible to set it t…

@KalleSpang Thanks for confirm Go to Online Store->Theme->Edit code Asset->/Theme.scss.liquid->paste below code at the bottom of the file. @media only screen and (max-width: 749px) { .product-single__media { padding-top: 100% !important; img { height: 100%; object-fit: contain; } } …

Hello, @KalleSpang Welcome to the Shopify community! and Thanks for your Good question. Please share your site URL, So I will check and provide a solution here.

Hi, How kind of you! :slightly_smiling_face: :slightly_smiling_face: www.porlabottles.se Best regards,

@KalleSpang do you have like this? [KetanKumar_0-1603161838547.png]

Yes, that would be great! Best regards,

Thank you so much! I really appreciate your help! Like it alot more now! :grinning_face_with_smiling_eyes: For anyone who is interested in doing the same to their page, the “padding-top” paramater determines the size of the image, and it’s possible to assign a higher value than 100% if you want it…

@KalleSpang Thanks for update yes, you can

I sort of followed your instructions. My theme doesn’t have a Theme.scss.liquid…it only has a theme.liquid or theme.css so I posted that code in theme.css the image doesn’t get any smaller it just moves the carousel onto the image as if it was getting smaller but it doesn’t

@TheVinylFly Welcome to the Shopify community! and Thanks for your question. Please share your site URL, So I will check and provide a solution here.

Thanks Ketan, here is the link: https://thevinylfly.com/products/siser-htv-easy-weed-12-x-15?variant=37855830933694 . I’m going to eventually to enable my swatch widget and showcase the colors in the swatches…you wouldn’t happen to know how to hide the image carousel on mobile would you?

@TheVinylFly yes, sure let me know which one do you have hide?

Make product image smaller on mobile product page

Store Design

KetanKumar October 20, 2020, 2:44am 4

@KalleSpang

do you have like this?

Topic		Replies	Views
How can I resize product images without affecting mobile view? Store Design	1	41	August 21, 2022
Make product thumbnails smaller on the phone / Focal Theme Store Design design , shopify-themes	3	54	October 31, 2022
Reduce image size on product page just on desktop version (Modular theme) Technical Q&A	11	154	November 30, 2023
Prestige theme - Make product image smaller on mobile device Store Design customizations	2	66	March 22, 2023
Make The Product Image Bigger On Mobile Phone / Focal Theme Store Design design , shopify-themes	7	89	October 7, 2023

Make product image smaller on mobile product page

Related topics