How can i add custom metafield icon in my product card in the home page

How can i add custom metafield icon in my product card in the home page

user123452
Shopify Partner
1 0 0

I am trying to use metafield in my shopify product card code to add custom icons for different products but the metafield code does not seem to work if anyone can help me with this issue

Reply 1 (1)

Shadab_dev
Shopify Partner
160 5 18

@user123452 I did this on the dawn theme v15. I made a product metafield of type file which allows me to upload photos or videos. And  added this code in card-product.liquid file under snippets folder of the code editor.  

The line of code: {% if card_product.metafields.custom.image %}
<img src="{{ card_product.metafields.custom.image | image_url }}" alt="Product Image" width="40" height="40">
{% endif %} You can change the alt, width or height as per your liking.

This is how it looks for me.

Shadab_dev_0-1719250127244.png


hope this works out for you or you can send me your theme details. I will be more than happy to look into it. We could iprove the styling and stuff if this works out for you.

Thanks

If this is helpful, please Like and Accept the solution.
Buy me Coffee, if you feel i was helpful. Definitely a motivation to carry out gutting solutions. Need help with shopify liquid or any project in web dev- Feel free to Email Me

Thanks