Color Swatch issue on collection pages

[ablakart]

Hi Shopify community,

I have an issue with some color swatches on my collection pages. It affects .pngs I have added to the ASSETS folder in the Shopify Online Store admin. You'll see below that some of them are note showing anymore in collection pages.

I've noticed something when looking at the code. If you take the first product at this page: https://www.hiroclark.com/collections/color. And look at the first dot image source (desert dust color) is: https://www.hiroclark.com/cdn/shop/t/89/assets/desert%20dust.png. But when looking at it in my asset folder the source of it is https://cdn.shopify.com/s/files/1/0542/2553/t/93/assets/desert%20dust.png?v=1739377407. So it seems there's a mistake in the code as it should be /93 instead of /89. I am not sure where to fix this. Any idea on your end ?

Check this specific collection and you'll see what I mean: https://www.hiroclark.com/collections/color & below screenshot.

 
Thanks for your help!
Antoine

[Liquid_xPert_SJ]

Hi @ablakart,

I looked into it and found that the image source of the swatch code is looking for in the asset folder is missing, please place that color name swatch image in your assets theme folder example "salton sand.png" and then check hopefully it will resolve.

Thanks

[ablakart]

Hi @Liquid_xPert_SJ 

Thanks a lot for your help. This is weird because I can actually see the assets in my asset folder :(.

See below screenshot:

 

Thanks,

Antoine

[Liquid_xPert_SJ]

just replace the space with a hyphen (-) like i explain the file name above.

[ablakart]

Thanks for your help. It does not seem this is the issue here. I've noticed something when looking at the code. If you take the first product at this page: https://www.hiroclark.com/collections/color. And look at the first dot image source (desert dust color) is: https://www.hiroclark.com/cdn/shop/t/89/assets/desert%20dust.png. But when looking at it in my asset folder the source of it is https://cdn.shopify.com/s/files/1/0542/2553/t/93/assets/desert%20dust.png?v=1739377407. So it seems there's a mistake in the code as it should be /93 instead of /89. I am not sure where to fix this. Any idea on your end ?

[Liquid_xPert_SJ]

@ablakartwell you can find the file might be with the name swatch.liquid where the condition should be shown variant image something like this, Since every theme files and code structure is different i cannot exactly explain what code should be needs to be update and where to update, what is your theme name?

Thanks