color swatches

jorgesolis
New Member
3 0 0

Hi im trying to add color swatches in products grid. the problem is the squares of color are empty, can someone to figure out this issue. I already add somecolors in assets for testing and nothing. 

https://www.normastore.com.mx/collections/otono-2021-joseph

I add this code in route: snippets ->  product-grid-item.liquid  ->

 {% for option in product.options %}
{% if option == 'Color' %}
{% assign index = forloop.index0 %}
{% assign colorlist = '' %}
{% assign color = '' %}
{% for variant in product.variants %}
{% capture color %}
{{ variant.options[index] }}
{% endcapture %}
{% unless colorlist contains color %}
<img src="{{ color | downcase | append: '.png' | asset_url }}"
alt="{{ color }}" width="16" height="16" />
{% capture tempList %}
{{colorlist | append: color | append: ' '}}
{% endcapture %}
{% assign colorlist = tempList %}
{% endunless %}
{% endfor %}
{% endif %}
{% endfor %}

 

 

Captura.PNG

 

0 Likes
Propero
Shopify Partner
761 89 128

@jorgesolis ,

If you notice, there is extra character added ( mostly space) in your color name and hence the file name is not coming correcr.

Try use striping before appending .png

 

- Was my reply helpful? Click Like or Click Accept as Solution
To hire: email us at shopify@propero.in
checkout our app https://apps.shopify.com/picamaze
0 Likes
MS-WEB-DESIGNER
Shopify Partner
2623 170 440

Dear @jorgesolis 

We will be happy to help you.

0 Likes