Add a companion product to cart page

companion-product

{% comment %}
  To add a companion product to the cart automatically if a primary product is in cart:
  1. Create a new link list under your Navigation tab.
  2. In that link list, make the first link point to companion product.
  3. Copy your link list handle where indicated at line 8:
{% endcomment %}

{% assign linklist = linklists['put-your-link-list-handle-here'] %}

{% comment %}
  You're done. Include this code in cart.liquid at the top or bottom.
{% endcomment %}

{% if linklist.links.size > 0 %}

  <script>!window.jQuery && document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"><\/script>')</script>
  
  <script>
  if (typeof Shopify === 'undefined') var Shopify = {};
  Shopify.cart = {{ cart | json }};
  Shopify.toAdd = {{ linklist.links.first.object.variants.first.id }};
  var pleaseAdd = false;
  Shopify.idsInCart = [];
  for (var i=0; i<Shopify.cart.items.length; i++) {
    Shopify.idsInCart.push(Shopify.cart.items[i].id);
    if (Shopify.cart.items[i].id !== Shopify.toAdd) {
      pleaseAdd = true;
    }
  }
  if (pleaseAdd && (jQuery.inArray(Shopify.toAdd, Shopify.idsInCart) === -1)) {
    var params = {
      type: 'POST',
      url: '/cart/add.js',
      data: 'quantity=1&id=' + Shopify.toAdd,
      dataType: 'json',
      success: function(line_item) { 
        window.location.href = '/cart';
      }
    };
    jQuery.ajax(params);
  }
  </script>
  
{% endif %}

Anyway to adjust the code above to add a "processing and handling" fee of $19.95 to the cart when they add a product?
And maybe also have a small image thumb to represent what the fee covers there as well?

Thanks for any help!

This is awesome - so close to what I need, but as far as I can tell, this only works if you know which product is going to have companion products - currently, this must be hard-coded into the script. It would be advantageous to have the script check which product has been added and then match it up to a linklist.

So, how can this be modified to have the linklist variable populated from what is being added to the cart?

The shop I am building now has almost 700 products, half of these products have a companion product, so when product A1 is added, it needs to add Product A2. So too with product Z1, I need it to add Z2, and so on.

I also need this to work in reverse - add X2 to the cart, and X1 is added as well.

We will create the ~350 linklists to match the product pairings, but I'm at a loss as to how the modify the script to have it match the products to their companion linklists.

Any assistance would be greatly appreciated.

This is great and so close to what I am needing. Is there anyway you can only allow a quantity of 1 to be included. I have this working, so if someone spends 100.0 or more it automatically goes into their cart. However, they can add as many as they want in the quantity section so we are needing to remove that. Any help would be appreciated.

this wasn't working for me on Safari for iPhone. Works now that I made this link:

http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js

https instead of http

Nice solution. But what if you add multiple quantities of the parent product? Your solution is only adding 1 instance of the companion product no matter how many quantities of parent product are in cart.

Thank you for this!! Trying to find a different solution to add a gift to the shopping cart when they buy a specific product (without having to pay $25 a month for the app) and so glad I found this! So far, it's the closest I've been able to get.

I was able to implement it, and even edit it with @cpres addition to at least control the minimum price, but running into a big problem. Any idea how to remove the option for someone to add to the quantity of the gift?