Using Custom Liquid block to display an image

English Shopify Shopify Design
1

I’m trying to modify my Shapes theme by using the Custom Liquid section block to add an image that I have uploaded to the site files section of the site.
The problem is that I do not know how to code in liquid. I’ve found some various code statements that people have written that should do it but I’m not sure how to enter them.
I’m wondering if there is 1 line of code that I enter into that area to show the image?

2

Images are called assets in theme /assets folder, or admins file section.

AKA Hosted files for finding filters to use with them:

https://shopify.dev/api/liquid/filters#file_img_url

{{ 'potions-header.png' | file_img_url }}

To ouput an html tag, use the image_tag filter

https://shopify.dev/api/liquid/filters#image_tag

{{ 'potions-header.png' | file_img_url |image_tag }}
3

Thanks for replying.
I think I understand how it works.
I just read that shopify is supposed to compress and resize the file. It doesnt appear to have worked for me.

Also, when I enter the code, it just prints the code. It isnt displaying the image.

jwalter007_0-1665964421387.png
jwalter007_0-1665964421387.png1720×365 24.6 KB

4

I also expected this to work:

{{ 'my-file.png' | file_img_url | image_tag }}

But it produces an error:

Liquid error (snippets/... line 15): input to image_tag must be an image_url

Bug with the file_img_url filter?