How can I resize product images in the Boundless theme?

Technical Q&A
1

Hello, I am using Boundless theme for my online store. Can anyone advise how can I resize the product image to a smaller size in product page? It is now in 100% page width and extremely large when browsing on desktop.

Thank you.

2

@fwh the Boundless theme has that unique feature to show the full-width product image.

  1. From your Shopify admin, go to Online Store > Themes.

  2. Click Actions > Edit code.

The code editor shows a directory of theme files on the left, and a space to view and edit the files on the right.
theme/section/product-template.liquid

class="product__photo--variant lazyautosizes lazyloaded"

you have to find the code look like

{% for image in product.images %}
  
{% endfor %}

Custom image size :

{% for image in product.images %}
  
{% endfor %}

give anyone parameter like " 'width*hight ’ give any one-two make based on that ratio

see the image size reference.

Images
sizes
16x16 pico
32x32 icon
50x50 thumb
100x100 small
160x160 compact
240x240 medium
480x480 large
600x600 grande
1024x1024 1024x1024
2048x2048 2048x2048
master largest image (2048x)