Why isn't my image_tag filter working in Liquid?

[Arti-Art]

Hi! I had a problem where liquid would not output an image when using image_tag filter. I initially had an img_tag filter, which was working fine. But theme check told me it is a deprecated filter and that I should use image_tag instead. When I switched to image_tag, it would not work. The theme I was working on was not a 2.0 theme, so idk if it has something to do with that.
That suggestion pops up up also for the img_url filter, and probably others having img in them.

Also I think it's annoying that a newly downloaded Dawn theme shows up a lot of errors in theme check, around 300, both in Shopify CLI: shopify theme check, and in Shopify Liquid VsCode extension, which shows syntax highlighting from theme check.

Additional question: how would you go about deactivating that particular rule (img_tag > image_tag) for all files in .theme-check.yml

Thanks,
Arti

[lbnetprofit · Accepted solution]

Hi,

I just had the same problem. img_url is deprecated and image_url didn't work the same way img_url did.

Turns out the syntax is a little bit different.

img_url for example looks like this:

{{ ... | img_url: '150x' }}

image_url on the other hand looks like this:

{{ ... | image_url: width: 150 }}

Reference:

https://shopify.dev/api/liquid/filters/url-filters#image_url 

https://shopify.dev/api/liquid/filters/deprecated-filters#img_tag 

Hope I could help!

Lukas

[Jason_Tigas]

Also, I just want to add here that the new image_tag won't work with images in the assets folder.

{{ 'watch-feature-icon.jpeg' | asset_img_url: '19x24' | img_tag: 'Some alt text', 'feature-icon' }}

Above won't work with image_tag because we want to avoid images from assets and to have the merchant uploaded images instead.

[blackbolt2099]

Isn't that the sort of thing that should be in the docs? It isn't as far as I can see, and seems like the sort of thing that would leave people scratching their heads (or pulling out their hair) until they stumbled upon this answer.

[lawrevan]

Why would the new dawn theme ship with deprecated tags? 

Will shopify developers fix these tags and push to the dawn upstream repo in the future?

[lbnetprofit]

They actually did fix it 2 days ago. 

Here are the commits that contain the changes
https://github.com/Shopify/dawn/commit/ab607b97cb342f536029002674a7feac2b5abb31
https://github.com/Shopify/dawn/commit/63b57743b3d6e78d98dc963ecb3c6dffb7ad057d

[LeadDreamer]

Oh, so code that used to use the Theme editor to select images for, say, a slider that stored the images in the assets - using :

{
"type": "image",
"id": "slide_1.jpg",
"max-width": 2000,
"label": "Image",
"info": "2000 x 400px recommended"
},

in the settings_schema.json, with no other choice BUT to save in the assets, won't work with image_tag because "...you want to avoid images from assets..." - without bothering to actually document it anywhere, or mention it, whatever.

Sure.

Great approach.

[Austinh7]

Absolutely this. If someone could explain how to make image_tag work with these files that are referenced from settings_schema.json because that's where they are stored when the client is adding files via theme editor that would be really helpful. 

[gabocles]

Thank you for this. I was wondering the exact same thing. 

[MMision]

Coming back to this ghost forum to say that I'm also wondering the same! Has a solution been found or created for this?