Dawn theme large image on PDP

[shopfanify]

Hi everyone, 

I have made my first store in the Shopify Dawn theme, although there is something I can't figure out. 

On the PDP (product detail page) the first image and the last image (only if I have an odd number of images on the PDP) is very large. 

Does someone know how I can edit that to make all images the same size? 

Thanks!

 

[marcoswata]

In the file /snippets/product-thumbnail.liquid you can look for something like this:

<div class="product__media media" style="padding-top: {{ 1 | divided_by: media.preview_image.aspect_ratio | times: 100 }}%;">

And replace the media.preview_image.aspect_ratio with the aspect ratio you want.

For example, if you want images to be square, just go with 1 (so  the padding-top is 100% and you have a square image).

Then on the lines below that, find img_url and change them to be square (e.g. img_url: '500x500').

If you want to crop the image, you can do something like img_url: '500x500', crop: 'center'.
More info about the img_url filter here.