FROM CACHE - en_header

Add an item to cart automatically if another item is in it.

seangerke
Excursionist
46 0 1

I am trying to have the customer do fewer steps buy adding this.

 

If the customer adds this one Event to the cart, I want the cart to automatically add this product. It has no variants, just one product.

 

I followed this: https://community.shopify.com/c/Shopify-Design/Add-Companion-Multiple-products-to-basket-when-specif...

 

And then found out I have an Ajax cart.... womp womp....

 

So I have tried making a form and adding an extra button for the product.

My product id for the item that needs to be added is 6619002634270.

 

I tried forcing the "Add to Cart" button to add it as well, all I could get is an event product with the cartridge products title. That was weird.

 

my site is:

 

orders.biomodex.com

 

The steps are:

 

Add Event: Patient Specific Rehearsal (this auto adds the product: Patient Specific Cartridge) to the cart.

 

I literally pulled my hair out trying to get this to work they way I want to. Any suggestions?

Replies 48 (48)
Tejas_Nadpara
Shopify Partner
1087 216 530

@seangerke 

 

This solution does require working with code and Liquid files, and if this is something you would not be comfortable with, I would advise you to reach out to one of Shopify Experts, or contact me by mail. As always, when making code changes to your theme, please remember to create a backup, in case you need to revert back to previous versions of the theme. 

 

Thank you,

Tejas

Shopify Expert | Skype: tejas.nadpara
- Like and Mark as an Accepted Solution if reply helpful
- Feel free to contact me on support@hexaecommerce.com regarding any help
Jasoliya
Shopify Expert
4522 586 1138

Hi @seangerke 

In which condition you want to add extra product to cart?

Want to modify or custom changes on store hire me.
Want to convert visitor to buyers ? try This app.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
seangerke
Excursionist
46 0 1
Jasoliya,

I have one product that has a companion. Currently, it is a two step process. If you add this special event to your cart. You must add this 2nd product to your cart as well. This is the only time I would need this to work. One specific time. If you add event A you must add item B...

I am pretty deep into code but I still consider myself a novice. I usually edit code parameters, but not sure what everything needs or how it works.
Jasoliya
Shopify Expert
4522 586 1138

So you want like if product A in product then we need to add auto product B?

Want to modify or custom changes on store hire me.
Want to convert visitor to buyers ? try This app.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
seangerke
Excursionist
46 0 1
Yes, if product A is in cart auto add product B.

seangerke
Excursionist
46 0 1

I tried this:

 

{% for item in cart.items %}
{% if item.product.id == "29056231440487" %}
jQuery.post('/cart/update.js',
{
quantity:1,
id: 6619002634270

});

This is what I came up with but still not working. Am I adding the wrong IDs? First picture goes to the top, 2nd pic is reference to product I want added.product Aproduct A

product Bproduct B

Jasoliya
Shopify Expert
4522 586 1138

In this give instruction you can do this but need to change some code in Js to work with your condition.

Want to modify or custom changes on store hire me.
Want to convert visitor to buyers ? try This app.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Jasoliya
Shopify Expert
4522 586 1138

But you need to add this Js code within  <script> tag

Want to modify or custom changes on store hire me.
Want to convert visitor to buyers ? try This app.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
seangerke
Excursionist
46 0 1

Thank you for reaching out. I have given up on this part and modified the "add-on" to just be automatically included on the back end.

Ninthony
Shopify Partner
2272 342 944

Hmm, well part of the problem is that you're comparing the product id to a string I believe. I couldn't get that evaluation to be true until I took the product id out of the quotes. However, I still couldn't get it to execute my javascript. So instead of using liquid, I did everything in javascript and got this working:

 

  <script>
//get the cart
    let cart = $.getJSON('/cart.js');
// wait for the response
    cart.done(function(){
//when you have the response, get the JSON and set items to cart.items
    cart = cart.responseJSON;
    let items = cart.items;
// make a boolean to make sure that the item you want to add isnt already in the cart (to keep the JS from firing again on page reload)
    let item_in_cart_already = false;
//check the cart items and set boolean to true if the item is in the cart
      for(var i = 0; i < items.length; i++){
        if (items[i].product_id == 1999834054743){
        item_in_cart_already = true;
        }
      }
//then loop through cart items again and if the item isnt in the cart, and the corresponding product is found
//add it to the cart with the same quantity as the other product.
      if(!item_in_cart_already){
      for(var i = 0; i < items.length; i++){
        if (items[i].product_id == 1999834087511){
        let variant_quantity = items[i].quantity;
          Shopify.addItem(19754659905623, variant_quantity);
        }
      }
        setTimeout(function(){
        location.reload();
        },1000)
      }
    })    
  </script>

This is assuming you have the Shopify.addItem function in your store. You probably do already, but if you need it, here it is:

 

Shopify.addItem = function(variant_id, qty, properties, callback) {
  var qty = qty || 1;
  var params = {
    quantity: qty,
    id: variant_id
  }
  if(properties != false){
    params.properties = properties;
  }
  jQuery.ajax({
    type: "POST",
    url: "/cart/add.js",
    data: params,
    dataType: "json",
    success: function(line_item) {
      if ((typeof callback) === 'function') {
        callback(line_item);
      } else {
        Shopify.onItemAdded(line_item);
      }
    },
    error: function(XMLHttpRequest, textStatus) {
      Shopify.onError(XMLHttpRequest, textStatus);
    }
  });
};

That's what I came up with anyway. The only issue I saw is that if they update the quantity of their product on the cart page it will not update the quantity of the additional product.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
jewellsolutions
Shopify Partner
2 0 1

Where are you adding this? To the cart.liquid file?

Ninthony
Shopify Partner
2272 342 944

Yeah it's in cart.liquid, there was a mistake in the code I noticed later though. If any item was in the cart it was still reloading the page every second because I had the setTimeout set in the wrong place. Here's an updated version with variables for the product to compare against and the product to add's product id and variant_id -- to make it a little less confusing.

 

  <script>
    //get the cart
    let cart = $.getJSON('/cart.js');
    // wait for the response
    cart.done(function(){
      //when you have the response, get the JSON and set items to cart.items
      cart = cart.responseJSON;
      let items = cart.items;
      // make a boolean to make sure that the item you want to add isnt already in the cart (to keep the JS from firing again on page reload)
      let item_in_cart_already = false;
// product we are checking to see is in the cart let item_in_cart_prod_id = 1999834087511;
// the product we want to add's product id let item_to_add_prod_id = 1999834054743;
// the product we want to add's variant id let item_to_add_variant_id = 19754659905623;

//check the cart items and set boolean to true if the item is in the cart for(var i = 0; i < items.length; i++){ if (items[i].product_id == item_to_add_prod_id){ item_in_cart_already = true; } } //then loop through cart items again and if the item isnt in the cart, and the corresponding product is found //add it to the cart with the same quantity as the other product. if(!item_in_cart_already){ for(var i = 0; i < items.length; i++){ if (items[i].product_id == item_in_cart_prod_id){ let variant_quantity = items[i].quantity; Shopify.addItem(item_to_add_variant_id, variant_quantity); setTimeout(function(){ location.reload(); },1000) } } } }) </script>
If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
BCR2020
Tourist
5 0 0

Hello! 

Thank you for the effort you put into this! 

I tried added your code to the Cart.liquid page and I did not succeed. I removed the variant piece for the added item (product B) because there is no variant and I'm not sure if that's why it isn't working. 

Please help! 

 

William

BCR2020
Tourist
5 0 0
Ninthony
Shopify Partner
2272 342 944

There is always a variant, even if you havent set any variants there's a default variant. You can echo out the variant id in product.liquid to figure out what it is with:

 

{{ product.first_available_variant.id }}
If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
BCR2020
Tourist
5 0 0

I'm sorry, can you explain how I would find this default variant ID using the product.liquid page? 

BCR2020
Tourist
5 0 0

@Ninthony 

Great news. I was able to find my default Variant IDs (as you instructed). I correct your code in my cart.liquid file using the correct Product IDs, and Variant ID. 

After saving the file and testing, it did not auto-add Product B once I added Product A.

Any thoughts?

Ninthony
Shopify Partner
2272 342 944

Couldn't tell you. I'd have to look at the code and debug it, I wrote this a while ago. You can message me your store URL and I can request access and take a look. Let me know what product you want to add automatically, and what item should be in the cart for it to happen.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
julvir
New Member
2 0 0

Ninthony, 

 

I have also similar problem, i try 10 apps... and i not manage make it working ( i want to keep AJAX cart ) 

 

your solution will work on AJAX cart ? if yes, how to contact you for you check my shop ? (it's my first post)

 

thank you