Solved

Trouble with the "added to cart" snippet

  • 13 April 2022
  • 1 reply
  • 235 views

Badge +2

Hi!

 

I’m having trouble installing and seeing the Added to Cart metric for one of my clients. 

I’ve inspected my clients Shopify store, and I have applied the class snippet as below:

 

Here is the snippet on the Shopify theme:

I’ve Cookied myself in Incognito and tested it. The “Viewed Product” tracking is working correctly, but I cannot see the “Added to Cart” still.

 

Just curious what I’m doing wrong?

 

Thanks so much!

icon

Best answer by alex.hong 13 April 2022, 23:35

View original

1 reply

Userlevel 7
Badge +58

Hi there @rjms13,

Welcome to the Community!

It's important to note that when you add Klaviyo's web tracking to your site, we only track the browsing activity of "known browsers" — i.e. browsers that have visited and engaged at least once before. Klaviyo will not track anonymous browsers.

 

There are three key ways Klaviyo will be able to identify a site visitor for web tracking purposes:

  • If someone has, at some point, clicked through a Klaviyo email to your website
  • If someone has, at some point, subscribed/opted-in through a Klaviyo form
  • If someone has, at some point, logged into your site and you have identify tracking installed via Klaviyo's API.

 

As a result, you probably won't see a lot of tracked web activity from these metrics right away.  As you continue sending over time, Klaviyo will identify more and more of your contact-base and your web tracking data will become more comprehensive.

 

I am also going to leave a review of the steps in case:

Klaviyo's Viewed Product snippet and Added to Cart snippets can now very easily be added via a Custom Liquid block for Shopify 2.0 Themes (if you do not have a 2.0 theme, please skip below). To do this, please follow the steps below:
 

  1. In Shopify, navigate to your theme and click Customize
     
  2. At the top of the page, click the Home page dropdown, and select Products > Default product to be brought to your default product page. 
    ?name=inline685893383.png
    ?name=inline-1331390334.png
  3. Click Add section in the left sidebar, and then select Custom Liquid.
    ?name=inline-2043703939.png
    ?name=inline-343879352.png
  4. Paste the Viewed Product snippet and/or the Add to Cart snippet into the Custom Liquid text box.
    mceclip2.png
    *If you are pasting both snippets, you can do this all at once with the Add to Cart snippet directly beneath the Viewed Product snippet. 
     
  5. Click Save in the upper right. 

 
If you prefer to follow along with a video, you can watch this process here
 
After making this update, Viewed Product tracking and/or Add to Cart Tracking should now be applied to all of your product pages. You can test this out as a cookied (identified) profile by doing the following: 
 

  1. Go to your website
  2. Add ?utm_email=youremail@example.com to the end of your website URL (of course using your email address in place of this example email address) like this: www.yoursite.com?utm_email=youremail@example.com
  3. Proceed to view a product page 
  4. Press the Add to Cart button (if applicable)
  5. Check your profile within Klaviyo to see that the Viewed Product metric and Added to Cart metric were properly recorded!

 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Skip to here if you do not have a Shopify 2.0 theme. 
 
If you do not see the option to add a Custom Liquid Block into your default Product Page template as outlined here, then you can follow these alternative methods for installation instead:
 

  1. Navigate to your Shopify admin > Online Store > Edit Code, and you should see a product.json template (this is where the product.liquid template lives for Shopify 1.0 themes). 
     
  2. Click on the product.json template and refer to the name you see listed within sections > main > type:
    ?name=Img+1.png

    *Please note that the names within your “sections” may vary, and there may be multiple sections. You need to find the section referring to "main".
     
  3. In this example, the name is product-template. Then locate that title within the Sections folder: 
    ?name=inline-992728604.png
     
  4. So in this example, it is the product-template.liquid section file that we would open up, and search for the characters schema
    ?name=Img+3.png
     
  5. Then, you can proceed to insert the Viewed Product snippet and Add to Cart snippet (if applicable) directly above the schema line and click Save. 


Once you've added the Viewed Product snippet properly, please follow along this guide for the Add to Cart Snippet. I also noticed on your site that your button does not have a button ID, so following instructions to the article linked above should be of help.
 
?name=image.png
 
 Let me know if that helped,

Alex

 

Reply