Problem: An image URL is generated from the navigation title. When the corresponding asset doesn’t exist in Shopify’s assets, it renders a broken image. The goal is to conditionally show an alternative when the image isn’t found.
Guidance: It isn’t possible (in this scenario) to detect a wrong/missing image path with Liquid at render time. A suggested workaround is using an inline HTML onerror attribute on the img tag to handle load failures client‑side (onerror fires when the image fails to load) and hide the image.
Example direction: While no specific code snippet was provided, the recommendation is to add onerror to the img element so it hides itself if the URL is invalid.
Status: No Liquid-based conditional solution was provided; a client-side onerror approach is recommended. The thread does not confirm an implemented fallback (e.g., alternate image), so the issue appears partially unresolved.
Hello Shopify Experts,
I’ve added an images based on my navigation title, and according to that, I want to add one condition that if an image is not available in the asset, then it will show else part.
Currently, I have my navigation title, and based on that, I’ve created one image URL, but there is no image that I’ve added to the Asset folder.
So, it shows a broken image.
Hello @anupam1607
You can’t find if the image path is wrong in this scenario.
You can try
{% if bb %} {% else %} {%endif%}
Or can use an inline onerror attribute for this, For example:
This will hide the image if there is an error on the image URL path.