Klaviyo 'Added to Cart' Event - Snippet Help

Highlighted
New Member
2 0 0

Hi All,

 

I have tried to add the 'Added to cart' snippet to my code to track add to cart events but it does not seem to be working. I followed steps in the following article:

https://help.klaviyo.com/hc/en-us/articles/115001396711-Create-a-Custom-Added-to-Cart-Event-for-Shop...

 

I added this code in my product.liquid :

<script type="text/javascript">
var _learnq = _learnq || [];
document.querySelector('.action_button.add_to_cart').addEventListener('click',function (){
_learnq.push(['track', 'Added to Cart', item]);
});

</script>

 

In my parallax theme, I have this code for the add to cart button :

<button type="submit" name="add" class="action_button add_to_cart" data-label="Add to Cart"><span class="text">Add to Cart</span></button>

Capture d’écran 2020-09-21 à 14.30.39.png

 

I also tried to replace in the code : '.action_button.add_to_cart' by '.action_button add_to_cart' and '.add_to_cart' but it does not seem to be working. 

 

Can anyone help please?

Thanks

 

0 Likes
Highlighted
Excursionist
80 19 19

Hi Bernice

Have you checked that there is only one matching element on the page?

This will only add the event listener to the first button that matches those conditions.

You're right selector is definitely this based on what you've said:

'.action_button.add_to_cart'

But as I said - it will only attach that listener to the FIRST button in the source that matches that condition.

Look for another class around it that will identify the main product section itself as add that before the selector string above?

Can you send a URL and I might be able to provide some more exact advice.

Thanks

 

0 Likes