Drop down menu Shopify：用下拉选择替换产品单选按钮

使用Shopify，我试图改变我的产品模板，以显示下拉选择列表，而不是我的产品变体的单选按钮。我设法做到了这一点，但当您尝试从列表中将产品添加到购物车时，它会显示“未传递任何变体ID”

以下是他们单选按钮的代码：

<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>

{product.variants%中的变量为%0}

{%if variant.available%}
{{variant.sku}{%if variant.title！={%endif%}{{variant.price{124; money_with_currency}}的默认“}{{{{variant.title}}
{%else%}
{{variant.title}}卖完了！
{%endif%}

{%endfor%}

以下是我的下拉选择代码：

<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>

{product.variants%中的变量为%0}

{%if variant.available%}
{{variant.sku}{%if variant.title！={%endif%}{{variant.price{124; money_with_currency}}的默认“}{{{{variant.title}}
{%else%}
{{variant.title}}卖完了！
{%endif%}

{%endfor%}

谢谢

韦德

这个维基找到了我问题的答案。

这个维基有我问题的答案