Shopify - How to update product price on update

Question

I have been trying to figure out the best way to add a free product to the cart in Shopify, but can't find what I am looking for in their documentation.

What I need to do is to add a product to the cart if the cart value is £10 or more. I have managed to get the product added, but how can I change the price to zero? Also, how can I ensure that if the user selects a higher quantity of the product, they do not get multiple free items and only get one free item? Hope that makes sense.

Here is what I have so far which works really well to add the product. But not change the price.

*EDIT: I realise if I can't change the price of an item then can I apply a fixed discount code at the cart page level?

**EDIT: Come to think of it, a discount code wouldn't work anyway because the user can easily remove the free product and still get the discount. Perhaps I need to either create some kind of hidden product that can not be searched for on the store, add that to the cart and disable the quantity selector.

There must be a way to do this because there are apps that can do it.

**I do not want to use an app

<script>
$(".cart__qty-input").blur(function() {

    location.reload();
})(jQuery);
</script>

{% assign product = all_products['free-gift'] %}

{% unless cart.item_count == 0 or product.empty? or product.variants.first.available == false %}
{% if cart.total_price >= 1000 %}
  {% assign variant_id = product.variants.first.id %}

  <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 ) ) {
  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>
{% endif %}
{% endunless %}

Vladimir Vladimir · Accepted Answer · 2020-05-07T02:17:01

You can achieve that by using standard Shopify functionality.

Create a collection that contains all product except the gift one.
Create an automatic discount using the following configuration:
- Type: Buy X get Y
- Customer spends: Minimum purchase amount
  - Amount: £10
  - Any items for: Specific collections
  - Search and add the collection you created in the 1st step
- Customer gets:
  - Quantity: 1
  - Any items from: Specific products
  - Search and add the product you want to use as a gift (the one that doesn't belong to the collection created in the 1st step)
  - At a discounted value: Free
  - Set a maximum number of uses per order: enable it and set the value to 1

The above must suit your specification.

Then you can still use the scripts you've already created to automatically add/remove the gift product to the cart based on cart total (if that's necessary). If a customer will change the quantity of the gift product to 2 or more he will get it by the standard price specified in Shopify. Only one gift item will be discounted if the cart meets the criteria.

Shopify - How to update product price on update

1 Answers