我正在使用Shopify。我在产品页面上设置了2个“添加到购物车”按钮,第一个用于计量表的第一个变量,第二个按钮用于最后一个样本变量。所有产品都是一样的。客户可以订购任意数量的米,但我们希望客户仅限于每种产品/面料的1个样品,每个订单总共只有5个样品(任何产品/面料)。
我做了一些研究,似乎我需要使用回调,但我不知道如何编写/创建任何类型的脚本,所以不知道如何做到这一点。
这是我对第二个按钮的编码:
<section class="sample-area">
<hr style="width: 50%; margin: 20px 25%;" />
<h3 style="text-transform: uppercase; padding-bottom: 15px;">Order a free sample</h3>
<form class="sample-form" id="sample-form" method="post" action="/cart/add">
<input type="hidden" id="quantity" name="quantity" value="1">
<input type="hidden" name="id" value="{{ product.variants.last.id }}" data-variant-title="{{ product.variants.last.title }}"/>
<input type="submit" class="action-button enter" value="{{ 'products.product.add_to_cart' | t }}" />
以下是购物车的编码:
<td class="price">{% if item.price > 0 %}<span class="money mets">{{ item.price | money }}</span>{% else %}<span>FREE</span>{% endif %}</td>
<td class="quantity">{% if item.variant.title contains "Sample" %}<input type="hidden" class="field" value="{{ item.quantity }}" data-id="{{ item.variant.id }}">{{ item.quantity }}
{% else %}
<select id="updates_{{ item.variant.id }}" name="updates[]" class="drops">
{% for i in (2..20) %}
<option value="{{ i }}" {% if item.quantity == i %} selected{% endif %}>{{ i }}</option>
{% endfor %}
</select>{% endif %}</td>
<td class="total"><span class="money">{{ item.quantity | times: item.price | money }}</span></td>
<td class="remove last"><a href="/cart/change/{{ item.variant.id }}?line={{ forloop.index }}&quantity=0">v</a></td>
然后最后这里是关于按钮的脚本
ProductView.prototype.events = {
"click #product-area .thumb": "determineSelectedThumb",
"click .fullscreen-product-viewer .thumb": "determineSelectedThumb",
"click .toggle-fullview": "openFullview",
"click .fullscreen-product-viewer": "closeFullview",
"click .fullscreen-product-viewer .modal": "stopProp",
"click #product-area .submit": "addProductToCart",
"click #product-area .enter": "addSampleToCart",
"click .modal-wrap .close": "closeFullview",
"change #product-area .single-option-selector": "resetErrors"
};
ProductView.prototype.addSampleToCart = function(e) {
var quantity, submitButton, variant;
if (Theme.productQuickAdd) {
e.preventDefault();
submitButton = this.$(e.target);
if (this.processing === false) {
submitButton.data("original-text", submitButton.val()).val(Theme.pleaseWait).addClass("disabled");
this.processing = true;
variant = this.$(".product.variants.last.id").val();
quantity = this.$("1").val();
return Shopify.addItemFromForm('sample-form', (function(_this) {
return function(product) {
Shopify.getCart(function(cart) {
return _this.updateMiniCart(cart);
});
submitButton.val(Theme.addedToCart);
return setTimeout(function() {
submitButton.val(submitButton.data("original-text")).removeClass("disabled");
return _this.processing = false;
}, 2000);
};
})(this));
} else {
return false;
}
}
};
感谢您的帮助 - 如果我遗漏了任何内容或您想要更好的解释,请告诉我(并且道歉不够清楚)。
重申 - 样品始终是每种产品的最后一个变体。此功能禁用,如果已经在购物车中,最多5个样品(无论哪种产品)仅适用于样品变体。
非常感谢