Я пытаюсь добавить небольшую строку на своей странице товара Shopify, где она будет показывать покупателю сумму, которая в данный момент находится в его / ее корзине, и автоматически показывать, имеет ли клиент право на бесплатную доставку, и сумму, необходимую для Хит бесплатная доставка.
Мне удалось сделать все вышеперечисленное, с одной маленькой проблемой: когда покупатель нажимает «добавить в корзину», строка все еще показывает то же самое, пока клиент не обновит страницу. Я немного почитал и рассказал, что это потому, что тележка работает на чем-то, что называется AJAX.
Я не программист и не разработчик, я просто владелец сайта, и у меня очень мало знаний о кодировании. Я просто ищу решения, копирую, вставляю и модифицирую код, чтобы получить желаемый эффект. Но этот действительно поставил меня в тупик, поэтому я ценю, если кто-то может мне помочь!
Заранее спасибо!
Также я прошу прощения, если мой код выглядит грязным, или я звучу так, будто не знаю, о чем говорю. Я действительно новичок в этом!
<div id="freeship" style="font-weight:bold; padding: 10px;">Your cart total is <span style="color:#f64c3f">{{ cart.total_price | money }}</span>. You qualify for free shipping!</div>
<div id="nofreeship" style="font-weight:bold; padding: 10px;">Your cart total is <span style="color:#f64c3f">{{ cart.total_price | money }}</span>.<br>Spend {{ 2500 | minus: cart.total_price | money }} more to qualify for free shipping!</div>
<script>
!function checkprice() {
var y = "2600" ;
var x = "{{ cart.total_price }}";
if (Number(x) > Number(y)) {
document.getElementById("freeship").style.display = "block";
document.getElementById("nofreeship").style.display = "none";
} else {
document.getElementById("freeship").style.display = "none";
document.getElementById("nofreeship").style.display = "block";
}
} ();
</script>
UPDATE:
Райан, это то, что мне удалось выкопать, я думаю, это код, который обновляет миникарту вверху, когда товар добавляется в корзину?
function checkprice() {
var baseprice = "2500" ;
var carttotal = "{{ cart.total_price }}";
if (Number(carttotal) > Number(baseprice) {
document.getElementById("freeship").style.display = "none";
document.getElementById("nofreeship").style.display = "block";
} else {
document.getElementById("freeship").style.display = "block";
document.getElementById("nofreeship").style.display = "none";
}
};
ProductView.prototype.updateMiniCart = function(cart) {
var i, item, itemProperties, itemText, j, len, miniCartItemsWrap, productPrice, propertiesArray, propertyKeysArray, ref, variant;
miniCartItemsWrap = $(".mini-cart-items-wrap");
miniCartItemsWrap.empty();
if (cart.item_count !== 1) {
itemText = Theme.cartItemsOther;
} else {
itemText = Theme.cartItemsOne;
$(".mini-cart .options").show();
miniCartItemsWrap.find(".no-items").hide();
}
$(".mini-cart-wrap label").html("<span class='item-count'>" + cart.item_count + "</span> " + itemText);
ref = cart.items;
for (j = 0, len = ref.length; j < len; j++) {
item = ref[j];
productPrice = Shopify.formatMoney(item.line_price, Theme.moneyFormat);
variant = item.variant_title ? "<p class='variant'>" + item.variant_title + "</p>" : "";
itemProperties = "";
if (item.properties) {
propertyKeysArray = Object.keys(item.properties);
propertiesArray = _.values(item.properties);
i = 0;
while (i < propertyKeysArray.length) {
if (propertiesArray[i].length) {
itemProperties = itemProperties + ("<p class=\"property\">\n <span class=\"property-label\">" + propertyKeysArray[i] + ":</span>\n <span class=\"property-value\">" + propertiesArray[i] + "</span>\n</p>");
}
i++;
}
}
miniCartItemsWrap.append("<div id=\"item-" + item.variant_id + "\" class=\"item clearfix\">\n <div class=\"image-wrap\">\n <img alt=\"" + item.title + "\" src=\"" + item.image + "\">\n <a class=\"overlay\" href=\"" + item.url + "\"></a>\n </div>\n <div class=\"details\">\n <p class=\"brand\">" + item.vendor + "</p>\n <p class=\"title\"><a href=\"" + item.url + "\">" + item.product_title + "</a><span class=\"quantity\">× <span class=\"count\">" + item.quantity + "</span></span></p>\n <p class=\"price\"><span class=\"money\">" + productPrice + "</span></p>\n " + variant + "\n " + itemProperties + "\n </div>\n</div>");
};checkprice()
if (Theme.currencySwitcher) {
return $(document.body).trigger("switch-currency");
}
};