La visualización de productos en Shopify esta planificada para visualizarse como un producto diferente cada combinación de color, teniendo atributo seleccionable la talla, con la finalidad de apoyar a los clientes que usen shopify, se menciona en este documento una guía de código fuente para visualizar los atributos de colores en la ficha de producto agrupados, asi como tener la visualización de los atributos enviados desde el omnicanal.
Agrupación de Colores
Se recomienda realizar la agrupación de COLORES de productos por medio de un código adicional en shopify para poder visualizar los productos asociados a diferentes colores.
Este codigo muestra todos los atributos como metadatos enviados desde hermes, asi como las convinaciones de colores asociadas por el modelo, puede ser colocado donde mejor se adapte segun el diseño de cada web.
<div>
<h4>Atributos:</h4>
<ul>
{% for entry in product.metafields.MODDO.product.attributes %}
<li>{{ entry[0] }}: {{ entry[1] }}</li>
{% endfor %}
</ul>
<h4>Otros modelos:</h4>
<ul>
{% assign productsSameModel = shop.metafields.MODDO_MODEL[product.metafields.MODDO.product.idPmm].products %}
{% for entry in productsSameModel %}
{% if entry.handle != product.handle and all_products[entry.handle].available %}
<li> <a href={{ all_products[entry.handle].url }}> <img src="{{ all_products[entry.handle] | img_url: '100x100' }}"> {{ all_products[entry.handle].vendor }} {{ all_products[entry.handle].title }} {{ entry.handle }} {{ all_products[entry.handle].options_by_name['Color'].values [0] }} </a> </li>
{% endif %}
{% endfor %}
</ul>
<h4>Otros modelos (sin filtro de disponibilidad):</h4>
<ul>
{% assign productsSameModel = shop.metafields.MODDO_MODEL[product.metafields.MODDO.product.idPmm].products %}
{% for entry in productsSameModel %}
{% if entry.handle != product.handle %}
<li> <a href={{ all_products[entry.handle].url }}> <img src="{{ all_products[entry.handle] | img_url: '100x100' }}"> {{ all_products[entry.handle].vendor }} {{ all_products[entry.handle].title }} {{ entry.handle }} {{ all_products[entry.handle].options_by_name['Color'].values [0] }} </a> </li>
{% endif %}
{% endfor %}
</ul>
</div>
Moddo no hace modificaciones directamente en el front end de la plataforma del cliente, toda integración es a través de las API's nativas del sistema, es posible realizar adecuaciones bajo previo acuerdo y estimaciones con desarrollo personalizado.
El código aquí expuesto es una propuesta con la finalidad de mejorar para los clientes la visualizacion de los datos enviados desde Moddo Platform, el uso, instalación y modificaciones son responsabilidad de cada cliente.