将集合页面 Shopify 中变体产品的“添加到购物车”更改为“选择选项”

Question

我已设法在 Out of the Sandbox 的 Flex 主题中将“添加到购物车”按钮添加到我的收藏页面。但是，对于变体产品，当您单击添加到购物车时，它会自动将默认变体产品添加到购物车。我想更改此设置，以便在按钮上显示“选择选项”而不是“添加到购物车”，然后单击它会将您带到产品页面，然后您必须在将其添加到购物车之前选择变体。

添加到购物车按钮的代码是：

<form method="post" action="/cart/add">
<input type="hidden" name="id" value="{{ product.variants.first.id }}" />
<input type="submit" value="{% if product.variants.first.available%}Add to Basket{% else %}Out of Stock{% endif%}" class="button ajax-submit action_button button--add-to-cart" {% unless product.variants.first.available %}disabled{% endunless %} />
</form>

有人可以帮忙吗？

谢谢

Answer 1

这样的事情会起作用：

{% if product.available == false %}
    <span>Out of Stock</span>
{% elsif product.has_only_default_variant %}
    <form method="post" action="/cart/add">
        <input type="hidden" name="id" value="{{ product.variants.first.id }}" />
        <input type="submit" value="Add to Basket" class="button ajax-submit action_button button--add-to-cart" />
    </form>
{% else %}
    <a href="{{ product.url }}">Choose option</a>
{% endif %}