We would like to make the add to cart event trigger whenever a product is added to the cart on ANY Shopify page. I have seen this question asked many times, but have not seen an answer that is not “hire a developer.” With slide carts, and buy buttons on home pages and collection pages, customers actually reaching a product page is not very likely anymore. We would expect most customers to be adding directly from home or collection pages, so the current Klaviyo Add to cart and view product triggers are only going to work occassionaly. The fact that Klaviyo refuses to help with this is baffling to me given that add to cart is an extremely important event.
About 6 months ago, a helpful Klaviyo representative gave me some code that actually DID work on all non-product pages. At the time, we were on Shopify 1.0 and have upgraded our theme to a 2.0 theme. Now that same code no longer works. I am pasting it below for folks who might still be able to use it and also to see if any people might know the way to adapt it to a 2.0 Shopify theme.
The below is an exact quote:
________________________________________________________________________________
- Login to your Shopify admin
- Navigate to Online Store > Themes > Actions > Edit Code
- Search for the theme.liquid file
- Scroll down to the bottom of the file
- Insert the following code directly above the closing
</body>tag:
<script type="text/javascript">
setTimeout(function(){
var _learnq = window._learnq || [];
if (typeof(item) !== 'undefined') {
var _learnq = _learnq || [];
document.getElementById("AddToCart-product-template").addEventListener('click',function (){
_learnq.push(['track', 'Added to Cart', item]);
});
}
else {
var classname = document.querySelectorAll(".scaqv-quickadd form a");
var addToCart = function() {
_learnq.push(['track','Added to Cart']);
}; for (var i = 0; i < classname.length; i++) {
classname[i].addEventListener('click', addToCart, false);
}
};
var classname = document.querySelectorAll(".hs-upsell-add button");
var addToCart = function() {
_learnq.push(['track','Added to Cart']);
}; for (var i = 0; i < classname.length; i++) {
classname[i].addEventListener('click', addToCart, false);
};
}, 2000);
</script>
Save this change, then delete the old 'Added to Cart' script wherever you previously installed it. The above script should entirely replace the other 'Added to Cart' script you were previously using.
The above script should do all of the following:
- Tracks an 'Added to Cart' event with product-specific information on product pages.
- Tracks an 'Added to Cart' event without any product-specific information on non-product pages.
- Tracks an 'Added to Cart' event without any product-specific information from the slide cart drawer.