在shopify中从收集页面添加产品到购物车

时间:2018-03-07 15:41:15

标签: shopify liquid

我在shopify中的收藏页面添加了一个“添加到购物车”按钮。按钮有效,但是当选择了与默认选项(大小)不同的选项(大小)时,它仍会将默认大小添加到购物车。 这是我的代码

{% for product in collection.products %}
      <form action="/cart/add" method="post" enctype="multipart/form-data">
    {% unless product.has_only_default_variant %}
    {% for option in product.options_with_values %}
    <div class="selector-wrapper js">
      <div class="col-size">
      <p>Select your size</p>
      <select
        id="single-option-selector"
        data-single-option-selector
        data-index="option{{ option.position }}" size="6">
      {% if option.name == 'Size' %}
        {% for value in option.values %}
        <option
          value="{{ value | escape }}"
          {% if option.selected_value == value %}selected="selected"{% endif %}>
            {{ value }}
          </button>
        </option>
        {%endfor%}
      {% endif %}
          </select>
        </div>
      </div>
      {% endfor %}
    {% endunless %}

    <select name="id" class="no-js" data-product-select>
      {% for variant in product.variants %}
        <option
          {% if variant == current_variant %}selected="selected"{% endif %}
          {% unless variant.available %}disabled="disabled"{% endunless %}
          value="{{ variant.id }}">
            {{ variant.title }}
        </option>
      {% endfor %}
    </select>



    <input type="submit" value="Add to cart" class="btn" />
        <input type="hidden" name="return_to" value="back" />
  </form>
{% endfor %}

任何人都知道如何解决这个问题,以便将正确的选项添加到购物车中?

1 个答案:

答案 0 :(得分:0)

您需要修改代码的这一部分,并确保所有产品都有大小为option1。

您也可以将option1调整为option2或3,但只需确保它是集合中所有产品的尺寸选项。

  {% for variant in product.variants %}
    <option
      {% if variant.option1 == "Large" %}selected="selected"{% endif %}
      {% unless variant.available %}disabled="disabled"{% endunless %}
      value="{{ variant.id }}">
        {{ variant.title }}
    </option>
  {% endfor %}