Shopify: استبدال أزرار راديو المنتج مع القائمة المنسدلة حدد

Question

مع Shopify ، أحاول تغيير قالب المنتج الخاص بي لعرض قائمة تحديد القائمة المنسدلة بدلاً من أزرار الراديو لمتغيرات المنتج الخاصة بي. تمكنت من القيام بذلك ، لكن عندما تحاول إضافة منتج إلى العربة من القائمة ، يقول: "لم يتم تمرير أي معرف متغير".

هنا هو رمز أزرار الراديو الخاصة بهم:

<ul id="product-variants">
            {% for variant in product.variants %}
            <li>
              {% if variant.available %}
                <input type="radio" name="id" value="{{variant.id}}" id="radio_{{variant.id}}" style="vertical-align: middle;" {%if forloop.first%} checked="checked" {%endif%} />
                <label for="radio_{{variant.id}}"><span class="sku">{{ variant.sku }}</span>  {%if variant.title != 'Default' %}{{ variant.title }} for {%endif%}  <span class="price">{{ variant.price | money_with_currency }}</span></label>
              {% else %}
                <del style="margin-left: 26px">{{ variant.title }}</del>&nbsp;<span>Sold Out!</span>
              {% endif %}
            </li>
            {% endfor %}
          </ul>

فيما يلي رمز القائمة المنسدلة في هذه المرحلة:

<select id="product-variants">
            {% for variant in product.variants %}
            <li>
              {% if variant.available %}
                <option value="{{variant.id}}" selected="selected"><span class="sku">{{ variant.sku }}</span>  {%if variant.title != 'Default' %}{{ variant.title }} for {%endif%}  <span class="price">{{ variant.price | money_with_currency }}</span></option>
              {% else %}
                <del style="margin-left: 26px">{{ variant.title }}</del>&nbsp;<span>Sold Out!</span>
              {% endif %}
            </li>
            {% endfor %}
          </select>

شكرًا،

واد

Answer 1

https://help.shopify.com/themes/development/templates/product-liqid

كان هذا ويكي الإجابة على سؤالي.