How to setup Klaviyo
The Dominate Checkout Hosted solution allows you to integrate Klaviyo within your checkout page by placing the following script inside the Default Settings or Store > Custom Code section at your Dominate Account.
The following script will allow you to identify a visitor using the purchasing email and will trigger the Start Checkout and Order Items events, it will also track the abandonment cart process and integrates seamlessly with the existing Magento 2 Klaviyo extension.
To include the Klaviyo Integration, please follow these steps:
- Login to your Dominate Checkout account.
- Click on the Default Settings tab or access your preferred Store Settings.
- Go to Custom Code -> Head Code.
- Paste the following code, replace YOUR_COMPANY_ID with your Klaviyo Account ID, and click the Save button.
<script type="application/javascript" async src="https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=YOUR_COMPANY_ID"></script><script>// Klaviyo Integration$(window).on("load", function() {if(window._learnq && window._learnq.identify) {if(window._learnq.isIdentified()) {initKlaviyoStartedCheckoutEvent();} else if(window.checkoutData.customer.email) {identifyKlaviyoUser(window.checkoutData.customer.email);} else {$(document.body).on('input', '#email', delay(function () {if(!window._learnq.isIdentified() && $(this).valid()) {identifyKlaviyoUser($(this).val());}}, 2000));}}})function identifyKlaviyoUser(email) {window._learnq.push(['identify', {'$email': email}]);console.log("Klaviyo User Identified - " + email);// First _learnq.push request needs to be finished, before sending the next one.// No way to figure out when it is finished, that's why 2sec timeout was addedsetTimeout(initKlaviyoStartedCheckoutEvent, 2000);}function initKlaviyoStartedCheckoutEvent() {let cart = window.checkoutData.cart,cartItemsNames = [],cartItemsData = [],eventData = {"$event_id": "started_checkout_" + $.now(),"$value": cart.grandTotal,"CheckoutURL": document.referrer + 'checkout_page',};$.each(cart.items, function (key, data) {let item = data.cartItem;cartItemsNames.push(item.name);cartItemsData.push({"SKU": item.sku,"ProductName": item.name,"Quantity": item.qty,"ItemPrice": item.price,"RowTotal": parseFloat(item.qty * item.price).toFixed(2),"ImageURL": item.image,})});eventData.ItemNames = cartItemsNames;eventData.Items = cartItemsData;window._learnq.push(["track", "Started Checkout", eventData]);console.log("Klaviyo 'Started Checkout' Event was triggered");}function delay(fn, ms) {let timer = 0;return function(...args) {clearTimeout(timer)timer = setTimeout(fn.bind(this, ...args), ms || 0)}}</script>