How to use asset image in Shopify code

[amisha-29]

I want to use one image as a deafult in my shopify editor but it is not loading only text is showing,  I want to use this image as a default so if the person buy my theme then they can see that image .  i add that in imae in my shopify asset folder is there any wrong with this code please let me know

 <img src="{{ 'watermark-1.png' | asset_url }}" loading="lazy" alt="Default Top-Right Watermark" width="{{ section.settings.watermark_image_1_width }}" height="auto">

[devcoders · Accepted solution]

Hello @amisha-29 

Make sure the image filename in your assets folder is exactly watermark-1.png (all lowercase, no spaces). For example:

Correct: assets/watermark-1.png

Wrong: assets/Watermark-1.PNG or assets/watermark_1.png

<img
src="{{ 'watermark-1.png' | asset_url }}"
loading="lazy"
alt="Default Top-Right Watermark"
width="200"
height="auto">

[amisha-29]

I was using the wrong name of the image , but after fixing that still it is not loading the image

[devcoders]

Hello @amisha-29 
Kindly share your store URL and password (if it is password-protected), so that I can review it and provide you with an accurate solution.

[tim]

Ideally, you should upload your image to Files area of your Store, rather than Theme Assets. There were cases when font files loaded to the theme Assets were corrupted. It's possible that the same happens with your image.

If you upload to Files, then the code should be amended to use file_url filter, like:

src="{{ 'watermark-1.png' | file_url }}"

[amisha-29]

Hy after restarting the server image started showing thanks alot😊