Auto Add Item from CTA Click | Shopify Only

Looking to upsell some items? With a little custom code we've created you can now auto add an item to your cart page from a CTA click. 

Check out this video or follow the instructions below: 

SHOPIFY CUSTOMERS: If you installed Justuno onto your Shopify store BEFORE 6/25/2017 please uninstall the application and reinstall it to activate these features. 

Step 1: Head to your promotions section and hit New Promotion then Custom Promotion. 

Step 2: Choose unlocked, name your promotion then hit create. 

Step 3: Choose a template and edit your design accordingly. Please make sure to have a CTA layer that will add the item in question

CTAadd.pngStep 4: Paste this code in the custom pop up JS section of your design: 

//$(function(){
$(document).on('click', '.design-layer[data-layertype="standard-button"] .design-layer-editable[data-id!=""]', function(){

var pass_data = {
'juCustom':true,
'variantid':jju(this).data('id')
};

$.postMessage(
JSON.stringify(pass_data),
parent_url,
parent
);

});
//});


customcodearea.png

customcode.png

Step 5: Paste in the code below in the tab js section and make sure both override default JS toggles are on

 
window.juIframeCatch = function(data){
jju.ajax({
url: '/cart/add.js',
type: "post",
dataType: "text",
data: {"id":data.variantid,"quantity":1}
}).done(function( data ) {
document.location = '/cart';
});
}

Step 6: Find the variant ID that you want to auto add to your cart, this is usually located in the URL of the product. For example: https://www.thegldshop.com/products/diamond-cuban-link-choker-10mm-in-yellow-gold?variant=36451285842

Step 7: Paste in the variant ID in the Data ID option of the CTA. Now you have a CTA that will Auto add an item to your cart!

variantIDlocation.png

TAGS: Upsell, auto add item, increase cart

 

Have more questions? Submit a request

2 Comments

  • 0
    Avatar
    Rudy Est

    Hi Jenna, 

    Sounds like a very nice feature, but nothing happens when clicking CTA.

    I even tried to hard code the variant ID, but still no luck.

    I 'd appreciate any advice you may have.

    PS: I am on shopify.  App installed last week.

    Thanks,

    Rudy

  • 0
    Avatar
    Yuno

    Hi Rudy! 

    It appears that there was a step missing and more custom code that needed to be added to the promotions custom code tab area. Please check out the additional code that was added to the article and this feature should work for you! 

     

    Feel free to reach out to support directly with any other questions

Please sign in to leave a comment.