Integrate Convert Experiences with Klaviyo

THIS ARTICLE WILL HELP YOU:

• Convert-Klaviyo Integration
• Add Tracking Code Snippets
• Activate Convert-Klaviyo Integration 
• View Convert Data in Klaviyo

Convert-Klaviyo Integration

Klaviyo helps growth-focused eCommerce brands drive more sales with super-targeted, highly relevant email, Facebook and Instagram marketing.

For each experiment, the integration uses custom events to pass along the experiment name and variation name that the visitor is currently bucketed into (if any).

Add Tracking Code Snippets

Make sure the Convert tracking code and the Klaviyo snippet are installed on your page. Once you have added the codes to your website, you will be able to use Klaviyo account to start sending more personalised emails to your customers through smart data decisions.  

Activate Convert-Klaviyo Integration 

Add the code below to your website right after the Convert + Klaviyo tracking codes which will send Convert Experience and Variation names to your Klaviyo account. We are using event tracking:

<script>
var refObject = window['convert']['data']['experiments'];

for (var key in window["convert"]["currentData"]["experiments"]) {
		if (!window["convert"]["currentData"]["experiments"].hasOwnProperty(key)) {
			continue;
}}

var currentExperiment = window["convert"]["currentData"]["experiments"][key];
var curExperimentName = refObject[key] && refObject[key].n ? refObject[key].n : "unknown experiment name";
curExperimentName = curExperimentName.replace("Test #", "Test ");
var curVariant = currentExperiment['variation_name'] ? currentExperiment['variation_name'] : "unknown variant";
curVariant = curVariant.replace("Var #", "Variation ");

_learnq.push(['track', 'Convert Experience', { 'Experience' : curExperimentName , 'Variation' : curVariant }]);
</script>

The following code is for the newer, v1, version of the tracking code:

// Function to handle the data sending to Klaviyo
function sendDataToKlaviyo(data) {
    if (typeof _learnq === "object" && typeof _learnq.push === "function") {
        data.forEach(item = {
            _learnq.push(['track', 'Convert Experience', {
                'Experience': item.expName,
                'Variation': item.varName
            }]);
            console.log("Sent data to Klaviyo: Experience =", item.expName, "Variation =", item.varName);
        });
    } else {
        console.error("Klaviyo tracking function (_learnq) is not available.");
    }
}

// Function to check if a library (e.g., Klaviyo) is loaded, with a timeout
function whenAvailable(name, callback) {
    const maxTime = 150 * 1000; // Maximum time to wait in milliseconds (2.5 minutes)
    const interval = 100; // Poll every 100 milliseconds
    let elapsedTime = 0; // Track the elapsed time

    var intervalId = setInterval(function() {
        if (window[name]) {
            clearInterval(intervalId);
            callback();
        } else if (elapsedTime  maxTime) {
            clearInterval(intervalId);
            console.error(name + " library did not load in time.");
        }
        elapsedTime += interval;
    }, interval);
}

// Convert snippet lifecycle hook for experiences evaluated
window._conv_q = window._conv_q || [];
window._conv_q.push(function() {
    convert.on('snippet.experiences_evaluated', function() {
        console.log("All experiments have been evaluated");

        // Prepare the data for each experiment and variation
        const allData = Object.keys(convert.currentData.experiments).map(expId = {
            const expData = convert.currentData.experiments[expId];
            const variation = expData.variation_name || "unknown variant";
            let experimentName = convert.data.experiments[expId] && convert.data.experiments[expId].n ? convert.data.experiments[expId].n : "unknown experiment name";
            experimentName = experimentName.replace("Test #", "Test ");
            return { expName: experimentName.replace("Test #", "Test "), varName: variation.replace("Var #", "Variation ") };
        });

        // Wait for the Klaviyo library to be available
        whenAvailable('_learnq', function() {
            // Once Klaviyo is available, process and send data
            sendDataToKlaviyo(allData);
        });
    });
});
       

View Convert Data in Klaviyo

Using a custom event, you will be able to view all of your Convert Experiences data as they associate to the values that you pass in the event in your Klaviyo account.