Passer au contenu principal
La Consent Management Platform d’Usercentrics contient toutes les informations de confidentialité requises et à jour. Avec l’intégration Usercentrics, Kameleoon se connecte automatiquement à Usercentrics, accède à la politique de consentement au sein de la plateforme et l’utilise lors de l’affichage des expériences et personnalisations sur votre site web. Principaux avantages :
  • Gestion automatique du consentement des utilisateurs via la CMP Usercentrics sans configuration supplémentaire.
  • Assure la cohérence dans la gestion du consentement et permet une conformité fluide.
  • Rassurez vos utilisateurs sur le fait que leurs données sont utilisées de manière conforme.

Ajouter Kameleoon en tant que Data Processing Service dans Usercentrics

Vous devez sélectionner un nouveau Data Processing Service dans Usercentrics. Pour cela :
  1. Cliquez sur Service Settings dans l’interface admin d’Usercentrics.
  2. Cliquez sur Add DPS via Database > Kameleoon.
  1. Sélectionnez votre catégorie dans la liste déroulante Category.
IDs de modèles Kameleoon :
  • Kameleoon AB Testing&Personalization / Template ID : H1yDxp7JN
  • Kameleoon Only AB Testing Module / Template ID : 9FYjH37-J
  • Kameleoon Only Personalization Module / Template ID : 2lh8-reEz

Configurer l’IAB TCF dans Usercentrics

Pour activer l’IAB TCF 2.2 (Usercentrics & Kameleoon), vous devez suivre ces étapes :
  1. Configurez Kameleoon en tant que fournisseur (id:820) dans Usercentrics.
  2. Dans l’interface admin d’Usercentrics, accédez à Service Settings.
  3. Définissez la version de la CMP sur Version 2.
  1. Cliquez sur Configuration.
  2. Activez Transparency & Consent Framework 2.2 (TCF)
  1. Activez l’intégration IAB TCF dans Kameleoon.
Si vous ne pouvez pas activer TCF 2.2 dans Usercentrics, vous pouvez utiliser une configuration de script personnalisé.
Ne bloquez pas Kameleoon si le statut du consentement est inconnu (première visite). Sinon, cette configuration est obsolète.
Cette configuration est optimisée pour montrer aux utilisateurs des campagnes à un statut de consentement inconnu sans tracking. Vous pouvez également afficher des modifications pour l’A/B testing sur les pages d’entrée de votre projet.
  1. Dans Kameleoon, définissez votre politique de gestion du consentement et choisissez Consent required.
  2. Intégrez les fonctions Kameleoon suivantes :
    • enableLegalConsent
    • disableLegalConsent
Pour en savoir plus sur le consentement légal dans Kameleoon, lisez cette documentation. Pour des informations plus techniques sur les états et les modes, lisez cette documentation.
Vous pouvez utiliser un script personnalisé directement dans une page, dans Google Tag Manager, ou dans le Global custom script dans l’application Kameleoon. Si vous souhaitez utiliser des scripts personnalisés dans le Global custom script, suivez ces étapes :
  1. Accédez au menu Projects.
  2. Cliquez sur Configuration sur la carte de votre site ou application mobile.
  1. Dépliez la section General.
  2. Copiez et collez l’un des blocs de code ci-dessous, selon le modèle Kameleoon que vous avez choisi.

Exemple de script personnalisé si l’A/B testing et la personnalisation sont sur le même service

Kameleoon AB Testing&Personalization / Template ID: H1yDxp7JN

function setConsentStatus(type, status, action) {
        if (status) {
            window.kameleoonQueue.push(function() {
                Kameleoon.API.Core.enableLegalConsent(type);
                console.log('enableLegalConsent ' + type)
            });
        } else if (!status) {
            window.kameleoonQueue.push(function() {
                Kameleoon.API.Core.disableLegalConsent(type);
                console.log('disableLegalConsent ' + type)
            });
        }
    }

    function initKameleoonLegalConsent(type) {
        window.kameleoonQueue = window.kameleoonQueue || [];
        window.kameleoonQueue.push(function() {
            Kameleoon.API.Core.runWhenConditionTrue(() => typeof UC_UI !== 'undefined' 
            && UC_UI.isInitialized() === true
            && window.localStorage.getItem('uc_user_interaction') === 'true', () => {
                const abtesting = UC_UI.getServicesBaseInfo().filter((service) => service && service.id === 'H1yDxp7JN');
                if (abtesting.length > 0) {
                    setConsentStatus('BOTH', abtesting[0].consent.status);
                }
            }, 200);
        });
    }
    initKameleoonLegalConsent();

Exemple de script personnalisé si l’A/B testing et la personnalisation sont sur des services différents

  • Kameleoon Only AB Testing Module = Template ID: 9FYjH37-J
  • Kameleoon Only Personalization Module = Template ID: 2lh8-reEz
function setConsentStatus(type, status, action) {
        if (status) {
            window.kameleoonQueue.push(function() {
                Kameleoon.API.Core.enableLegalConsent(type);
                console.log('enableLegalConsent ' + type)
            });
        } else if (!status) {
            window.kameleoonQueue.push(function() {
                Kameleoon.API.Core.disableLegalConsent(type);
                console.log('disableLegalConsent ' + type)
            });
        }
    }

    function initKameleoonLegalConsent(type) {
        window.kameleoonQueue = window.kameleoonQueue || [];
        window.kameleoonQueue.push(function() {
            Kameleoon.API.Core.runWhenConditionTrue(() => typeof UC_UI !== 'undefined' 
            && UC_UI.isInitialized() === true
            && window.localStorage.getItem('uc_user_interaction') === 'true', () => {
                const abtesting = UC_UI.getServicesBaseInfo().filter((service) => service && service.id === '9FYjH37-J');
                if (abtesting.length > 0) {
                    setConsentStatus('AB_TESTING', abtesting[0].consent.status);
                }
                const perso = UC_UI.getServicesBaseInfo().filter((service) => service && service.id === '2lh8-reEz');
                if (perso.length > 0) {
                    setConsentStatus('PERSONALIZATION',perso[0].consent.status);
                }
            }, 200);
        });
    }
    initKameleoonLegalConsent();
Si vous avez des questions, n’hésitez pas à contacter votre Custom Success Manager Kameleoon.

A/B test du bandeau de consentement Usercentrics

Nous recommandons d’exécuter une seule Consent Experiment par site.
Pour exécuter un A/B test sur un bandeau de consentement Usercentrics, vous devez d’abord créer un objectif :
  1. Cliquez sur Configure > Goals > New goal.
  2. Dans Website Selection, choisissez le site web que vous avez défini lors de la création de votre compte.
  3. Sélectionnez Custom Goal dans Type.
    • Actuellement, Usercentrics prend en charge plusieurs événements personnalisés pour les objectifs personnalisés. Vous pouvez en savoir plus à leur sujet ici.
  4. Cliquez sur Next.
  5. Saisissez un nom pour votre objectif dans le champ Name your goal.
  6. Saisissez Kameleoon.API.Goals.processConversion (et l’Unique ID à l’intérieur) dans le champ Describe your goal.
    • Vous pouvez trouver l’ID dans le pop-in New goal à la fin du texte de la fonction.
Après avoir créé le nouvel objectif, vous devez créer une expérience :
  1. Allez sur le dashboard des expériences.
  2. Cliquez sur New Experiment. Un pop-in s’ouvre vous demandant quel type d’expérience vous souhaitez créer.
  3. Cliquez sur In the code editor > JS/CSS.
  4. Saisissez le Name, Website et URL of the page where you want to launch your experiment.
  5. Cliquez sur Validate. L’éditeur de code s’ouvrira.
  1. Cliquez sur Experiment (juste au-dessus de Variations dans le menu de gauche) et cliquez sur Test specific code dans le menu de droite.
  2. Ajoutez le code suivant :
window.UC_AB_VARIANT = "variant0";
 window.addEventListener('UC_UI_CMP_EVENT', function (data) {
      console.log("TEST: source =>", data.detail.source);
      console.log("TEST: type =>", data.detail.type);
      console.log("TEST: Variant =>", data.detail.abTestVariant);
      //These are our custom events for each basic action
      //in our Consent Management Platform
      if (data.detail.type === "CMP_SHOWN") Kameleoon.API.Goals.processConversion(Your Unique ID);
      if (data.detail.type === "ACCEPT_ALL") Kameleoon.API.Goals.processConversion(Your Unique ID);
      if (data.detail.type === "DENY_ALL") Kameleoon.API.Goals.processConversion(Your Unique ID);
      if (data.detail.type === "SAVE") Kameleoon.API.Goals.processConversion(Your Unique ID);
      if (data.detail.type === "MORE_INFORMATION_LINK") Kameleoon.API.Goals.processConversion(Your Unique ID);
      if (data.detail.type === "IMPRINT_LINK") Kameleoon.API.Goals.processConversion(Your Unique ID);
      if (data.detail.type === "PRIVACY_POLICY_LINK") Kameleoon.API.Goals.processConversion(Your Unique ID);
  });
  • variant0 est la variation par défaut que nous avons définie comme la variation vide, ce qui signifie qu’elle n’apporte aucun changement à la Consent Management Platform. Si votre variation par défaut a un autre nom, modifiez-la en conséquence. Utilisez window.UC_AB_VARIANT="variant0" pour accéder à votre variation par défaut.
  • L’Event Listener sera déclenché chaque fois que vous déclenchez l’un de nos Custom Events. Trouvez plus d’informations concernant les Custom Events pour l’A/B Testing ici
  • Les trois console.log renverront des informations importantes concernant votre événement. Par exemple, pour suivre ACCEPT_ALL comme le code l’indique, vous verrez ces logs :
 TEST: source => FIRST_LAYER
 TEST: type => ACCEPT_ALL
 TEST: Variant => variant1
Vous pouvez ajouter d’autres objectifs à cette expérience si nécessaire. Pour ajouter un nouvel objectif, ajoutez simplement le code suivant sous la dernière instruction « if ». if (data.detail.type === "Consent Management Platform event here") Kameleoon.API.Goals.processConversion(goalID)
  1. Revenez à l’onglet Variations.
  2. Dans Variation 1, ajoutez le code suivant : window.UC_AB_VARIANT = "variant1";
  3. Remplacez variant1 si vous avez donné un autre nom à votre variation.
  4. Dans l’onglet Finalize, sélectionnez votre distribution de trafic, votre ciblage, votre tracking et vos objectifs.
    • Ici, vous ajouterez l’objectif que vous avez créé. Vous pouvez rechercher l’ID unique de l’objectif. Si vous rencontrez des problèmes lors de la recherche, essayez d’utiliser uniquement les premiers chiffres de l’ID de l’objectif.
  5. Cliquez sur Publish pour finaliser la configuration de l’expérience.
Ce guide vous explique l’A/B testing interne d’Usercentrics.