Cropped images in srcset using image_tag

[alexr8]

I'm not sure if this is the right repo to post this bug so do let me know if it should be filed elsewhere.

If you specify a crop for an image with image_url and try and feed that into the image_tag, the generated srcset images always contain your original fixed height. For example:

{{
  media.preview_image
  | image_url: width: 416, height: 416
  | image_tag:
    loading: 'lazy',
    sizes: sizes,
    widths: '54, 74, 104, 162, 208, 324, 416',
    id: thumbnail_id,
    alt: media.alt
  | escape
}}

Each image that gets generated in the srcset will have height of 416 - so 54 x 416, 74 x 416, 104 x 416 and so on.

The images generated should take into account the aspect ratio - 54 x 54, 74 x 74 etc.

Also detailed here by another user: https://community.shopify.com/c/technical-q-a/image-tag-how-do-i-get-cropped-images-into-a-srcset/td-p/1472242.

[Simon Layfield]

+1 for this. I expected the same, and ended up having to switch to an HTML img tag for fine tuning responsive image sizes.

[Ceri (Waters Creative)]

+1