Ad

Shopify - Free Product With Purchase

- 1 answer

Snippet allows for free product to be applied to cart when a product in the specified collection is also present. Free product will be removed from cart if another product from specified collection is removed.

The Problem: User can add multiple items that all may not be from specified collection, then can remove specified collection products and free product will stay in cart. i.e. user can add product to populate cart with free item and then add another item that may be $5 compared to the item to populate the free item which may be $50 or more. In return user gets free product for $5 product purchase.

The snippet below works but I want it to be more robust. Currently, it works by replacing the 'product-handle' with the free gift to offer with purchase. It will only populate the free product if the free product and a product from the specified collection 'collection-handle' are present in the cart. If a product from the collection is removed the free item will also be removed from the cart.

The problem: There is the ability to add multiple items, and delete the original product that included the free item and checkout.

In search of a solution to remove the free product from the item, unless a product from the specified collection is present in cart.

{% assign product = all_products['PRODUCT-HANDLE'] %}

{% unless cart.item_count == 0 or product.empty? or product.variants.first.available == false %}

  {% assign variant_id = product.variants.first.id %}



{% assign found = false %}
{% unless cart.item_count < 1 %}
  {% for line_item in cart.items %}
    {% for collection in line_item.product.collections %}
      {% if collection.handle == 'COLLECTION_HANDLE' %} 
        {% assign found = true %}
        {% break %}
      {% endif %}
    {% endfor %}
  {% endfor %}


  <script>
  (function($) {
    var cartItems = {{ cart.items | json }},
        qtyInTheCart = 0,
        cartUpdates = {};
    for (var i=0; i<cartItems.length; i++) {
      if ( cartItems[i].id === {{ variant_id }} ) {
        qtyInTheCart = cartItems[i].quantity;
        break;
      }
    }
          if ( ( cartItems.length === 1 ) && ( qtyInTheCart > 0 ) ) {
      cartUpdates = { {{ variant_id }}: 0 }
    }
      else if ( ( cartItems.length >= 1 ) && ( qtyInTheCart !== 1 ) && {{found}} == true ) {

     cartUpdates = { {{ variant_id }}: 1 }



    }
    else {
      return;
    }
    var params = {
      type: 'POST',
      url: '/cart/update.js',
      data: { updates: cartUpdates },
      dataType: 'json',
      success: function(stuff) { 
        window.location.href = '/cart';
      }
    }; 


    $.ajax(params);

  })(jQuery);
  </script>

{% endunless %}
{% endunless %}

I expect the outcome to be if product A is added to cart then the cart will populate with free offer product B. If product A is then removed or not present in the cart then product B will also be removed from cart even if other products are present.

Ad

Answer

Try using Shopify Discounts automatic discount feature along with your script and have a value for the product which you are giving free. Below is how you create an automatic discount:

  1. Go to Discounts->Create Discount->Automatic Discount
  2. In Discount type select Buy X get Y
  3. Select the Collection or Product with which you want to give a free product
  4. Fill all other necessary details and rules you want to create

Now, whenever the rule is satisfied the product will be free in the cart and revert back to its original price if the rules are not met.

Ad
source: stackoverflow.com
Ad