gistfile1.txt

Here consider that these are the metafields that used for the color grouping.

Namespace is product for all the products
value for Product Handle to the metafield is value_1 to value_10
value for Title for that product in group is title_1 to title_10

Create normal text metafield for both the value. 

In title we need to add title like Red, Blue, Green as we have title of the product
In Product connection one, we can add handle of the product that you want to connect.


{% comment %}This is the code using which you can get all the grouped product on single product and on Product Grid on category page.{% endcomment %}
<ul>
     {% for i in (1..10) %}
     {% capture title %}title_{{i}}{% endcapture %}
     {% capture value %}value_{{i}}{% endcapture %}
     {% if product.metafields.product[value] %}
     <li ><a style="display: inline-block; width: 50px; height: 50px; margin-right: 5px; background-color: {{product.metafields.product[title] | handle}};"  href="/products/{{product.metafields.product[value]}}"><span style="display: none;">{{product.metafields.product[title]}}</span></a></li>
     {% endif %}
     {% endfor %}
</ul>

Hi,I would like to know how to add meta fields, I desperately want to add this feature to the site, please help me, thanks.