Is my Add to Cart button class notation or ID?

  • 20 October 2021
  • 2 replies

Badge +2

Hey there,

I’m having trouble figuring out if my Add to Cart button is using class notation or ID. I’ve tried both options but must be missing something. I’ll attach some screenshots.

Additionally, when I get to the Analytics page, I get a red error box at the top right. 

Red error box top right
Right clicking & Inspect Add to Cart Button on site



Best answer by Taylor Tarpley 20 October 2021, 18:35

View original

2 replies

Userlevel 7
Badge +60

Hi @Kpeezy


Welcome to the Community and thank you for sharing your question with us! 


Installing an ‘Added to Cart’ metric is a great idea to increase conversions for your brand among your users who are adding your products to their cart, but might be heading to checkout for whatever reason. However, adding this code can be tricky at times as you noticed because you need to idea your correct type of ‘Add to Cart’ button and insert it correctly in the proper code. It dos appear from your screenshot that your button is using the ID notation as it displays ‘ID’. If it was a class notation, you wouldn’t be able to find the word ‘ID’ at all in the code.


The button’s ID you would would want to install in the code highlighted section below would be “button-cart”. However, you will need to make sure there are no additional spaces or typos when inserting the code as this could prohibit it from firing correctly. 


If you have installed this correctly yet are still experiencing problems, can you confirm that the whole of your ‘Added to Cart’ snippet is placed below your ‘Viewed Product’ snippet on your Shopify theme file? The ‘Viewed Product’ metric need to be installed as well as located above the ‘Added to Cart’ code to successfully function.


Additionally, noting your specific Shopify theme is important when installing ‘Added to Cart’. The instructions in the documentation above list out the steps for default Shopify themes, however, if you’re using a custom Shopify theme, you have to paste ‘viewed product code ‘ on all custom product.liquid theme pages for this metric to fire. 


For the error message you see in your Analytics tab, its always a good idea to check out Klaviyo Status Page to see whether or not we are experiencing any issues with our product users need to be aware of. Sometimes this error message will disappear once you refresh your page, log out and log back in again. However, if you’re still seeing the error, I would contact our support team so they could do a deep-dive into your account to investigate the potential issue. 


For more insight into solutions to ‘Added to Cart’ metric troubleshooting, I’d recommend visiting the posts made by fellow users! 


Thanks for being a part of the Community! 


Badge +2

Hi! Trying another browser fixed the red error box!

Funny enough, the Added to Cart metric appeared as well, with the code entered into Shopify still in class notation when I tried “btn” as the class. However, I’ve switched it back to the ID notation with “button-cart”.

Maybe both work because there is a class & ID? Working fine now either way.

Thanks again!