Ich beabsichtige, eine Dropdown-Liste für die Produktvariante "Farbe" zu erstellen. In Verbindung mit dem Optionswert wird jedoch ein Bildmuster oder ein JPG angezeigt.

Ich habe dieses Tutorial gefunden, um die Zuordnung von Farbmustern zur Produktfarbauswahl vorzunehmen. Dies zeigt jedoch Varianten in einer Schaltflächenform anstelle der Standard-Dropdown-Liste an.

http://docs.shopify.com/manual/configuration/store-customization/add-color-swatches-to-your-products

Ich habe mit den Skripten rumgespielt, aber ich bin nie dazu gekommen, das zu bekommen, was ich brauchte. also hier bin ich für ein bisschen hilfe.

Hier ist meine Variantenliste:

<select id="product-select-option-1" class="single-option-selector">
  <option value="Red">Red</option>
  <option value="White">White</option>
  <option value="Black">Black</option>
</select>

generiert von:

{% for variant in product.variants %}
<option value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money }}  
</option>
{% endfor %}

Gibt es eine Möglichkeit für mich, mit einem 20x20 roten Quadrat value = "Red" zu verknüpfen oder red.jpg zu sagen?

Hier ist ein Screenshot für eine bessere Idee:

http://i.imgur.com/XgW2qHa.png