Skip to main content
Solved

Cannot track custom checkout in shopify

  • November 17, 2020
  • 4 replies
  • 600 views

Forum|alt.badge.img+2

Hello,

we have a custom checkout in a page in Shopify, and I, as the developer, would like to track customer’s steps in checkout, starting with ‘Started Checkout’ step.

the issue is that I can see no request sent to klaviyo at that point, I can see those console.logs but I cannot see a request sent with that _learnq.push… therefore, the checkout is not tracked in Klaviyo.

Please see image below:

 

Best answer by remstone

Hey @akhouad it looks like you’re trying to use the server side method and then passing that into the _learnq object.  You could do 1 of the following:

// cookie the user
_learnq.push(['identify', {$email: email}])
const data = {
  'Total Price': price,
  'Line Items': line_item
}
// track the event
_learnq.push(['track', 'Started Checkout', data])


// send using ajax
const data = {
  'token': token,
  'event': 'Started Checkout',
  'customer_properties': {
    '$email': email
  },
  'properties': {
    'Total Price': price,
    'Line Items': line_item
  }
}

$.get('https://a.klaviyo.com/api/identify?data=' + btoa(JSON.stringify(data)))

 

If you utilize the _learnq module then you will need to have klaviyo.js installed on the site.

 

Let me know if you have any questions!

 

View original
Did this topic or the replies in the thread help you find an answer to your question?

4 replies

Omar
Partner - Platinum
Forum|alt.badge.img+46
  • 2025 Champion
  • 494 replies
  • November 17, 2020

@akhouad not sure if this helps (i'm not a developer). but as far as I can see the shopify checkout started events are pushed serverside (if I'm right) not front-end side. isn't _learn.push a frontend solution? 
https://help.klaviyo.com/hc/en-us/articles/115005082927-Integrate-a-Standard-Ecommerce-Platform#started-checkout5
https://help.klaviyo.com/hc/en-us/articles/360031078492-Custom-Integration-FAQ

That being said if the klaviyo.js is loaded this should send an event to Klaviyo.
For tracking in the checkout I would advise to use serverside solutions (see links above). 


Forum|alt.badge.img+2
  • Author
  • Contributor I
  • 1 reply
  • November 17, 2020
Omar wrote:

@akhouad not sure if this helps (i'm not a developer). but as far as I can see the shopify checkout started events are pushed serverside (if I'm right) not front-end side. isn't _learn.push a frontend solution? 
https://help.klaviyo.com/hc/en-us/articles/115005082927-Integrate-a-Standard-Ecommerce-Platform#started-checkout5
https://help.klaviyo.com/hc/en-us/articles/360031078492-Custom-Integration-FAQ

That being said if the klaviyo.js is loaded this should send an event to Klaviyo.
For tracking in the checkout I would advise to use serverside solutions (see links above). 

Thank you for your reply, I can see in the second article you sent that they’re supported in both front-end and backend.

‘ Our Track and Identify APIs have both server-side and front-end (JavaScript) components. ‘


Omar
Partner - Platinum
Forum|alt.badge.img+46
  • 2025 Champion
  • 494 replies
  • November 17, 2020

Another thing you could test is sending it manually and see what (if any) error you get.

Also check the https://www.klaviyo.com/dashboard/activity dashboard to make sure the events are not coming in maybe under another name? 


Forum|alt.badge.img+5
  • Klaviyo Alum
  • 10 replies
  • Answer
  • November 19, 2020

Hey @akhouad it looks like you’re trying to use the server side method and then passing that into the _learnq object.  You could do 1 of the following:

// cookie the user
_learnq.push(['identify', {$email: email}])
const data = {
  'Total Price': price,
  'Line Items': line_item
}
// track the event
_learnq.push(['track', 'Started Checkout', data])


// send using ajax
const data = {
  'token': token,
  'event': 'Started Checkout',
  'customer_properties': {
    '$email': email
  },
  'properties': {
    'Total Price': price,
    'Line Items': line_item
  }
}

$.get('https://a.klaviyo.com/api/identify?data=' + btoa(JSON.stringify(data)))

 

If you utilize the _learnq module then you will need to have klaviyo.js installed on the site.

 

Let me know if you have any questions!