How to correctly use ImageTransformInput with Image.url in GraphQL?

Shopify Partner
5 1 2

When wanting to crop images  as aliases with GraphQL I use to be able to:

image {
  lg: transformedSrc(maxHeight: 704, maxWidth: 2816, crop: CENTER)
  xl: transformedSrc(maxHeight: 960, maxWidth: 3840, crop: CENTER)

 However, transformedSrc is now deprecated, and we are to use: But it's not obvious how to correctly use a set of ImageTransformInputs as a transform argument for Image.url object. I've tried things such as...

xl: url(transform:"maxHeight: 960, maxWidth: 3840, crop: CENTER")
xl: url(transform(maxHeight: 960, maxWidth: 3840, crop: CENTER))
xl: url(transform{maxHeight: 960, maxWidth: 3840, crop: CENTER})
xl: url(transform[{ maxHeight: 960}, { maxWidth: 3840}, {crop: CENTER}])

I just get parse errors with every argument style I try, be it string, array, or object.


How do we correctly use ImageTransformInput as a set of arguments on the Image.url object? 

Screen Shot 2022-03-20 at 8.33.38 AM.png


Replies 2 (2)

Shopify Partner
5 1 2

Sometimes you just have to shout into the either...

Correct way to use an input_object as argument.

xl: url(transform: { maxHeight: 960, maxWidth: 3840, crop: CENTER })


Shopify Partner
11 0 6

does this api just generally suck or am I missing something? How can i just ensure the image is a specifc aspect ratio with a max height?