Skip to main content

Integration Guide for Shopify

Step by Step guide to facilitate tracking events in Kayzen from a website using Shopify

P
Written by Pratiksha Pai
Updated this week

Last update: Nov, 2025

Introduction

This guide provides step-by-step instructions for integrating Kayzen’s event tracking into your Shopify store. Completing these steps ensures accurate event capture for actions such as page visits, Add to Cart, and purchases.


Requirements

  • Shopify Admin access (ability to edit Themes and Customer Events)

  • Basic knowledge of HTML and JavaScript

⚠️ Editing your theme code incorrectly may affect your store. If you are not confident, consult a developer before proceeding.


Overview

You’ll add two types of snippets:

  1. Site-wide snippet - install in your theme so it runs on all pages.

  2. Customer event snippet - add as a Custom Pixel on the Order Status page to capture purchases.


Site Wide Events Integration(theme)

To capture Kayzen events across all pages of your Shopify store, you’ll need to publish the event tracking snippet in your theme.liquid file.

1. Log in to your Shopify store’s admin dashboard.

2. From the sidebar, go to Online Store → Themes. Click the dropdown next to Customize.

3. Select Edit code

4. In the Layout section, open theme.liquid.

5. Head code - paste the Kayzen head snippet inside the <head> tag (near the top).

Since theme.liquid applies globally across your store, insert the following Kayzen initialisation code inside the <head> tag:

<!-- Kayzen Head Events Tag Start -->
<script>ktag=function(){ktag.q.push(arguments);};ktag.q=[];</script>
<script async src="https://webevents.kayzen.io/kayzenevents.js" data-api-key="<KAYZEN_API_KEY>"></script>
<!-- Kayzen Head Events Tag End -->

Note : Replace <KAYZEN_API_KEY> with your actual Kayzen API key.

To find your Kayzen API key, follow this article: Obtaining Kayzen API Key

6. Body code - paste the body snippet just above the closing </body> tag.

Scroll to the bottom of theme.liquid and insert the following snippet just above the closing </body> tag.

<!-- Start Kayzen Events Tag -->
<script>
(function() {
var pages = {'index': 'HomePage','collection': 'CollectionPage','product': 'ProductPage', 'cart': 'CartPage'}
if ('{{ request.page_type }}' in pages) {ktag(pages['{{ request.page_type }}'], true);}
document.addEventListener('click', e => {
if (e.target.closest('form[action$="/cart/add"] [type="submit"]')) {
ktag('AddToCart', true);
}
}, true);
})();
</script>

<!-- End Kayzen Events Tag -->

Tip: The AddToCart listener is applied globally to ensure it works alongside other event listeners attached to the same button.

7. Click Save to publish your changes.


Customer Events Integration (Order Status) - Required

To track purchase events, you must set up the Kayzen tracking code snippet on your order status page.

  1. From your Shopify Admin Dashboard, go to Settings (bottom-left corner)

2. Select Customer Events.


3. Click Add Custom Pixel to create a new pixel.


4. Paste the following code into the editor

Replace <KAYZEN_API_KEY> with your actual Kayzen API key.

window.ktag = function() {

window.ktag.q.push(arguments);
};
window.ktag.q = [];

const script = document.createElement('script');
script.async = true;
script.src = 'https://webevents.kayzen.io/kayzenevents.js';
script.dataset.apiKey = '<KAYZEN_API_KEY>';

var otherScript = document.getElementsByTagName('script')[0];
otherScript.parentNode.insertBefore(script, otherScript);


analytics.subscribe('checkout_completed', (event) => {

const totalPrice = event.data?.checkout?.totalPrice?.amount;
const currency = event.data?.checkout?.totalPrice?.currencyCode;

window.ktag('CustomerPurchase', true, totalPrice, currency);

});

5. Click Save (the Save button is at the top of the editor).

Note : The Purchase event in Shopify can only be triggered via the Customer Event Custom Pixel.

6. After saving, connect the pixel to ensure it is published to your store.


Kayzen click URL:

Click URL should have a mandatory Kayzen macro &bid_id={CONVERSION_ID} (if you want to track other details on Kayzen, you can refer to macro tracking article).


Verification

Once both snippets are installed:

  1. Open your store in a browser and use DevTools → Console to verify there are no errors.

  2. Trigger the main flows:

    • Visit the home page / product / collection / cart to verify page events.

    • Click Add to Cart and ensure AddToCart is logged.

    • Complete a checkout (or simulate a test order) to ensure CustomerPurchase is logged.

  3. Check Kayzen event logs to confirm events arrive on our side.


Troubleshooting

  1. Ensure the API Key is active and entered correctly.

  2. If events don’t fire, check for console errors or script conflicts.

  3. If checkout events don’t fire, confirm the custom Pixel is saved and connected/published.

  4. Clear cache and re-test after changes.

  5. Contact Kayzen Support if issues persist.

Did this answer your question?