Hello I’d like to make main product image smaller without making description larger. Every other solution suggested to reduce %of product image and then adjust %of info so that sum of both could be 100%. Other than these solutions, would it be possible only to resize product image so that it could be seen in one screen?thank you
password: peobew
You can reduce the width % of the first image, which is the main one , and that should solve it. You wont need to do anything to the wrapping divs.
And I dont get what you mean by resize product image so it could be seen in one screen..
Thank you! How can I reduce the width of main one?
And what I meant by being seen in one screen is seeing the whole image without scrolling down!
Oh okay, go to section-main-product.css and make changes on line 604.
It currently looks like this
@media screen and (min-width: 990px)
.product__media-list .product__media-item:first-child, .product__media-list .product__media-item--full {
width: 100%;
max-width: 100%;
}
change the max-width from 100% to 30%
Thank you but unfortunately i only works for the first image. The rest of the images are still too big… please help me
Kindly post a screenshot on how it looks on your end. And how small you want it to be.
I’d like images to be this big in the page.
and it looks like this on my end
First Image
I can help you make the other images smaller too. But to get the images in the reference site, you’ll need to hire a developer(Shopify partner) to custom code that for you.
