Integrate Kameleoon with Amplitude

portrait de l'auteur Julie Trenque

Written by Julie Trenque

Updated on 22/09/2020

2 min

Intermediate

Was this content useful?

The Amplitude Digital Optimization System helps digital teams, including product, marketing, engineering and beyond, deeply understand customer behavior in the digital product, predict which features and actions lead to business outcomes, and adapt each experience in real time to maximize its business impact.

Enable Amplitude integration on Kameleoon

As a first step, you will need to have Amplitude installed on your website.

Note: Please note that we do not recommend triggering the Amplitude snippet from Kameleoon as each tool manages its own consent management policy.

On your Kameleoon account, click on “Administrate” in the left menu, then on “Sites”.

On the card of your website, click on “Configuration”: you access the configuration of your website on Kameleoon.

Unfold the “General” section.

The “Global custom script” insert will allow you to link Kameleoon to Amplitude. Any JavaScript code you add in this insert will be executed each time the page is loaded. This feature is usually used to add complex tracking code or integration to other solutions.

To activate the bridge between Kameleoon and Amplitude, please copy and paste the code below in the Global script section.

window.amplitude_triggered_campaigns = window.amplitude_triggered_campaigns || [];
 var processCampaignForAmplitudePlatform = function(campaign)
 {
     var campaignId = campaign.id;
     var associatedVariationId = campaign.associatedVariation.id;
     var campaignName = campaign.name;
     var associatedVariationName = campaign.associatedVariation.name; 

 Kameleoon.API.Core.runWhenConditionTrue(function(){
 return typeof window.amplitude != "undefined" && typeof window.amplitude.Identify() == "function";
 }, function(){
 if(amplitude_triggered_campaigns.indexOf(campaignId) == -1){

    var campaignProperties = {
     KameleoonCampaignID: campaignId,
     KameleoonCampaignName: campaignName,
     KameleoonVariationID: associatedVariationId,
     KameleoonVariationName: associatedVariationName
         };
         window.amplitude.getInstance().setUserProperties(campaignProperties);

        amplitude_triggered_campaigns.push(campaignId);
         console.log("Amplitude tracking sent for campaign: "+campaignId);
     }
 }, 500);
}

// We loop over the experiments
 Kameleoon.API.Experiments.getActive().forEach(processCampaignForAmplitudePlatform);
 window.addEventListener("Kameleoon::ExperimentActivated", function(event) {
     processCampaignForAmplitudePlatform(event.detail.experiment);
 });

// We loop over the personalizations
 Kameleoon.API.Personalizations.getActive().forEach(processCampaignForAmplitudePlatform);
 window.addEventListener('Kameleoon::PersonalizationActivated', function (event) {
     processCampaignForAmplitudePlatform(event.detail.personalization);
 });

This code will send data to Amplitude whenever a visitor is being targeted by an experiment or a personalization. By default, we send the name and ID of the campaign, and the name and ID of the associated variation. You can adapt the code to your needs.

For instance if you don’t have the personalization module you can remove this part of the code:

Kameleoon.API.Personalizations.getActive().forEach(processCampaignForAmplitudePlatf
 rm);
 window.addEventListener('Kameleoon::PersonalizationActivated', function (event) {
 processCampaignForAmplitudePlatform(event.detail.personalization);
 }); 

This bridge is based on the Events that Kameleoon puts at your disposal. Learn more about Kameleoon Activation API

You can click on “Validate” to apply the changes to your configuration.

This custom bridge is based on Amplitude setUserProperties API. To know more, please refer to this documentation.