img_url returns 'no-image' placeholder, yet image exists

AuralFetish
Excursionist
33 0 25

Very weird. I have a section that my admin user has uploaded images with. On the exact page I want that layout, I do the layout. On other pages, That section, when included, spits out a string with delims that I defined. I use that string to repurpose the section's content and images in different ways across my site. Done it before with no issues that I recall.

But when I take that string, split it into an array, and trim (strip) the elements, everything works fine except img_url.

{{ myimage | img_url }} renders 'no-image' placeholder.

If I print out {{ myimage }}, I get the string: files/myimage.png

If I take that literal string and apply img_url, I get the expected image. In other words, when I bring it in as a string literal, I get the image. When I use a variable with that same string, img_url gives 'no-image'

{{ 'files/myimage.png' | img_url }} renders myimage.png

The only way I was able to get the full cdn path to the image was by stripping 'files/' from {{ myimage }} and using file_url.

{% assign myimage = imagestr | strip | remove: 'files/' %}
{{ myimage | file_url }}
/* renders the image */

{% assign myimage = imagestr | strip %}
{{ myimage | img_url }}
/* renders no-image  placeholder */

<h1>WHY!?!?!?!</h1>

Replies 9 (9)

Savior
Shopify Partner
537 108 161

Have you uploaded image in settings > files ?

or by theme customization ?

banned
AuralFetish
Excursionist
33 0 25

Yes. The image exists.

Savior
Shopify Partner
537 108 161

Hello AualFetish 

As you mentioned that when you wrote {{ myimage }}, you got the string: files/myimage.png

 

So please in your liquid code write {{ 'myimage.png' | file_url }}

To fetch image from file_url you have to write image name in single quotes.

 

Thankyou

 

Please like if the solution helped you !!!

banned
AuralFetish
Excursionist
33 0 25

Thanks, but if you see in my original post, I've done that.

{{ 'files/myimage.png' | img_url }} renders myimage.png

My question isn't "how" but "why". Why does img_url NOT work, but file_url does (if, for file_url I strip 'files/' from the value of my variable)?


Savior
Shopify Partner
537 108 161

Hello Auralfetish 

Kindly please refer this tutorial:

https://www.shopify.in/partners/blog/img-url-filter

For your better understanding that how img_url filter works.

 

Hope this will help you !!! 

Thankyou 

 

 

 

 

banned
AuralFetish
Excursionist
33 0 25

I've also googled it. I've come across that link multiple times, and it provides no answer as to WHY img_url will not work for a variable with a value of 'files/myimage.png', but works for a literal string 'files/myimage.png', as in this case.

If you have any insight to provide on ~that specific question~ I'd welcome your input.

 

AuralFetish
Excursionist
33 0 25

To recap:

{{ myimage }} evaluates to the string 'files/myimage.png'

{{ 'files/myimage.png' | img_url }} renders myimage.png

{{ myimage | img_url }} renders 'no-image' placeholder.

WHY?!?

tony5280
Shopify Partner
85 6 51

WHY, indeed.

jessie_monument
Shopify Partner
7 0 3

You need to use file_img_url instead of just img_url