How can I customize cart conditions for wine products?

Technical Q&A
1

Hello there,

I am trying to make a cart condition logic for the products in my store. I am not a shopify plus user and I am using the dawn theme.

i) This is for a specific collection of product which I tagged as “wine”. If a customer wants to order, he has to add at least 6 items in the cart or multiplication of 6 items in the cart (eg. 6, 12, 18, 24,30…)

If a customer does not fulfill this condition, he will not be able to proceed to checkout steps from the cart page. I am thinking of disabling the checkout button until the desired quantity of product is added in the cart. I have tried this code in the main-cart-items.liquid file. But this only works on page reload. This does not work automatically when I change the quantity in the cart page without reloading the page. Any suggestion on modifying the code would be highly appreciated. Thanks in advance.

Here is my code;

{% assign show_checkout_button = true %} {% for item in cart.items %} {% assign dividend = item.quantity %} {% assign divisor = 6 %} {% assign remainder = dividend | modulo:divisor %}

{% if item.product.tags contains ‘wine’ and remainder!=0 %}

You will need to purchase at least 6 wine bottles or multiplication of 6 bottles

Check out

{% else %}

Enough wine now

Check out {% endif %} {% endfor %} {% if show_checkout_button %}

{% endif %}

2

Hi @musfiq11

I understood your concern. I came to know that you can achieve it using custom code.

  • Please add the below code to the main-cart-items.liquid file

cart_liquid.png
cart_liquid.png1604×791 210 KB

data-tag='{{ item.product.tags | join: " " }}'
  • Please add the below code to the cart.js file

cart_js.png
cart_js.png1387×804 159 KB

let productTagList = event.target.dataset.tag;
    let productHasTag = productTagList.indexOf("wine");

    if ((productHasTag > -1)) {
      if (( event.target.value%6 == 0)) {
        document.querySelector('.cart__checkout-button').disabled = false;
      }
      else {
        document.querySelector('.cart__checkout-button').disabled = true ;
      }
    }

I hope it’s helpful to you.

Happy Coding!!

3

Hi @nidhipatel , thank you very much for your comment. But this code is not working on my cart page in the dawn theme. I have added the codes following your instruction. But it does not seem to work for my site.