Added to cart metric failed installed

  • 25 August 2021
  • 2 replies

Badge +2

My shopify theme is Ella. The ID for my Add to cart button as below

<input data-btn-addtocart="" type="submit" name="add" class="btn" id="product-add-to-cart" value="Add to Cart" data-form-id="#add-to-cart-form">

The snippet i put on my product.liquid as below; but the metrics haven’t showed the Added to cart.  Can anyone pls tell me what is wrong? Thank you. 

<script type="text/javascript">
    var _learnq = _learnq || [];
    document.getElementById("product-add-to-cart").addEventListener('click',function (){
         _learnq.push(['track', 'Added to Cart', item]);


Best answer by stephen.trumble 25 August 2021, 22:39

View original

2 replies

Userlevel 7
Badge +60

Hey @pikobag ,

Thank you for reaching out to the Klaviyo Community for help with your Add to Cart Button and web tracking, you are not alone in this question. Happy to help!

There are actually quite a few post on the Community that ask questions on this same topic! You can check them out here: 

These post talk about how your Add to Cart Button is identified and which tracking code snippet you need based on which if the two variations your Shopify theme uses. From what you posted it appears your Button is identified by “class” and not “button id”. Therefore you will need to use the alternate web tracking code snippet. There are also a few other community post that I did not add here but are excellent additional resources, if you search the Klaviyo Community for Add to Cart Metrics. 

Thank you so much for being a part of the Klaviyo Community! Hope this helps get you on a path forward to solve this challenge! 

Badge +2

Dear Stephen,


Thank you very much for your repl.y Since you said my Button is identified by class, i used the following code to paste on my product.liquid, but still not work.

<script type="text/javascript">
var _learnq = _learnq || [];
var classname = document.getElementsByClassName("add-to-cart");
var addToCart = function() {
_learnq.push(['track', 'Added to Cart', item]);
}; for (var i = 0; i < classname.length; i++) {
classname[i].addEventListener('click', addToCart, false);


I tried to change the (“add-to-cart”) into “btn” or “product-add-to-cart” or “Add to Cart” as below;  I even tried to paste “btn btn--full add-to-cart”, all are not workable. So i really don’t know how to do. Would you pls tell me how to do? thank you.