Comment utiliser Google Tag Manager pour simplifier le blocage des cookies

Nous vous expliquerons ci-dessous comment intégrer Google Tag Manager à Privacy Controls and Cookie Solution de iubenda pour vous conformer à la loi CCPA et au RGPD et proposer un consentement par catégorie.

Quelques définitions

Consultez la documentation officielle de Google pour plus d’informations sur Google Tag Manager. À présent, commençons le tutoriel !

Créer un compte et installer un conteneur

Pour commencer avec Google Tag Manager, vous devez créer un compte gratuit et configurer un conteneur.

Créer une balise

Une fois votre conteneur créé, vous pouvez passer à la création de votre balise. Comme nous l’avons mentionné plus haut, la balise représente le script qui s’activera uniquement dans des conditions précises, soit, dans le cas présent, lorsque l’utilisateur consentira à l’utilisation des cookies.

La balise que nous allons créer se rapportera à Google Analytics 4 :

Cliquez sur la section Configuration de la balise identifiée sur l’image ci-dessous :

Sélectionnez le type de balise Google Analytics: GA4 Configuration.

Ensuite, indiquez l’identifiant de suivi de votre propriété GA4 (par exemple, G-A2ABC2ABCD) et cliquez sur Enregistrer.

Vous pouvez maintenant définir les règles d’activation de la balise. Voyons comment procéder. 👉

Définir les règles d’activation de la balise

Après avoir renseigné les paramètres ci-dessus, nous devons définir les déclencheurs (soit les règles qui permettront de déclencher l’exécution des scripts) :

1. iubenda_consent_given ou, si vous avez activé la fonctionnalité de consentement par catégorie dans votre Privacy Controls and Cookie Solution, iubenda_consent_given_purpose_1...5
2. iubenda_preference_not_needed
3. iubenda_ccpa_opted_out
4. Si vous avez activé la prise en charge des lois d’États américains sur la vie privée, iubenda_consent_given_purpose_s, iubenda_consent_given_purpose_sh, iubenda_consent_given_purpose_adv et iubenda_consent_given_purpose_sd8

1.1 iubenda_consent_given

Cliquez sur la section « Déclenchement » identifiée ci-dessous :

Cliquez ensuite sur le petit signe + en haut à droite pour ajouter un nouveau déclencheur. À présent, dans la fenêtre de configuration du déclencheur, sélectionnez Événement personnalisé. Remarque : assurez-vous de NE PAS sélectionner « Toutes les pages » comme déclencheur.

Dans le champ « Nom de l’événement », saisissez la valeur suivante : iubenda_consent_given. Ainsi, le déclencheur sera activé pour Tous les événements personnalisés identifiés par Consent Given.

Enregistrez le déclencheur en cliquant sur Enregistrer :

1.2 iubenda_consent_given_purpose_1…5

Si vous avez activé la fonctionnalité de consentement par catégorie dans Privacy Controls and Cookie Solution, à la place de l’événement iubenda_consent_given, vous devrez créer un événement personnalisé pour chaque finalité présente dans votre bandeau cookies et votre politique relative aux cookies (sauf la finalité « Nécessaires »).

Si vous ne savez pas de quelle finalité ou catégorie relèvent les services qui fonctionnent sur votre site, il vous suffit de vous référer aux sous-titres sous lesquels ils sont listés dans votre politique relative aux cookies iubenda.

Voici les cinq finalités (avec pour chacune la valeur de l’événement personnalisé correspondant) :

1. nécessaires (inutile de créer un événement personnalisé)
2. fonctionnalité (iubenda_consent_given_purpose_2)
3. expérience (iubenda_consent_given_purpose_3)
4. mesure (iubenda_consent_given_purpose_4)
5. marketing (iubenda_consent_given_purpose_5)

Google Analytics relève de la catégorie « Analyses » comprise dans la finalité « Mesure ». Vous devrez donc créer un événement personnalisé ayant la valeur suivante : iubenda_consent_given_purpose_4. Ainsi, le déclencheur sera activé pour Tous les événements personnalisés identifiés par Consent Given Purpose 4.

Pour lois d’États américains, utilisez les événements suivants :

1. iubenda_consent_given_purpose_s : vente de mes informations personnelles
2. iubenda_consent_given_purpose_sh : partage de mes informations personnelles
3. iubenda_consent_given_purpose_adv : traitement de mes informations personnelles à des fins de publicité ciblée
4. iubenda_consent_given_purpose_sd8 : traitement de mes données de géolocalisation précises

Une fois que vous avez terminé, enregistrez le déclencheur.

2. iubenda_preference_not_needed

Suivez la même procédure pour créer un nouvel événement personnalisé que vous appellerez iubenda_preference_not_needed et qui correspondra au cas où la préférence de l’utilisateur n’est pas nécessaire (par exemple, lorsque la valeur de gdprApplies est false, ou lorsque celle de gdprAppliesGlobally est false, celle de countryDetection est true et l’utilisateur se trouve hors de l’UE) :

3. iubenda_ccpa_opted_out

Si la loi CCPA vous est applicable et, comme dans le cas présent, le script ou le service est considéré comme une vente, il est nécessaire de le désactiver lorsque l’utilisateur s’y oppose. Pour ce faire, vous devrez créer une exception que vous appellerez iubenda_ccpa_opted_out.

Avant de créer cet événement, vous devrez définir un filtre. Cliquez sur Variables, puis sur Nouvelle (à côté de Variables définies par l’utilisateur). Appelez-la iubenda_ccpa_opted_out, cliquez sur la zone Configuration de la variable et sélectionnez Variable de couche de données. Utilisez iubenda_ccpa_opted_out comme Nom de la variable de couche de données et sélectionnez Version 2 comme Version de la couche de données. Cliquez ensuite sur Enregistrer.

Une fois votre variable définie, créez un nouveau déclencheur que vous appellerez iubenda_ccpa_opted_out. Sous Configuration du déclencheur :

• sélectionnez Événement personnalisé comme Type de déclencheur
• saisissez .* comme Nom de l’événement et cochez Utiliser la correspondance avec expression régulière
• sous Conditions dans lesquelles le déclencheur est exécuté, choisissez Certains événements personnalisés puis sélectionnez iubenda_ccpa_opted_out, est égal(e) à et true.

Enfin, cliquez sur Enregistrer.

Au final, votre balise Google Analytics : GA4 Configuration ressemblera à l’exemple ci-dessous :

Cliquez sur Enregistrer pour enregistrer la balise.

Grâce à ces déclencheurs, Google Tag Manager activera la balise Google Analytics GA4 Configuration que nous avons créée ci-dessus uniquement lorsque l’une de ces conditions sera remplie. Cela signifie que ce script s’exécutera à chaque fois que Google Tag Manager recevra un événement dont la valeur sera iubenda_consent_given, iubenda_consent_given_purpose_4 ou iubenda_preference_not_needed.

Installer Google Tag Manager sur votre propre site

Pour installer Google Tag Manager, rendez-vous dans le panneau d’administration de GTM, copiez le code fourni par Google et insérez-le dans toutes les pages de votre site Web en suivant les instructions fournies. Si vous utilisez un système de gestion de contenu (CMS) qui charge l’en-tête de la page à partir d’un fichier modèle (p.ex. header.php), il vous suffit probablement de coller le code dans ce fichier.

Note : vous devrez retirer votre propre code Google Analytics.

Le script de Google Tag Manager activera automatiquement Google Analytics lorsque l’utilisateur ou le visiteur aura consenti à l’utilisation des cookies.

Installer le script de iubenda

Rendez-vous dans votre Tableau de bord iubenda > [votre site web] > Privacy Controls and Cookie Solution et cliquez sur le bouton Intégrer pour accéder à la section d’intégration :

Récupérez alors le code de votre bandeau cookies. Si vous n’avez pas encore activé la solution Privacy Controls and Cookie Solution, il vous suffit de cliquer sur Activer et de la configurer, puis de vous rendre dans la section d’intégration pour récupérer le code comme indiqué ci-dessus.

Votre code ressemblera à l’exemple suivant :

<script type="text/javascript">
    var _iub = _iub || [];
    _iub.csConfiguration = {
        "lang": "en",
        "siteId": XXXXXX, //use your siteId
        "cookiePolicyId": YYYYYY, //use your cookiePolicyId
        "banner": {
            "position": "float-top-center",
            "acceptButtonDisplay": true,
            "customizeButtonDisplay": true
        }
    };
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Vous devrez le modifier de la façon suivante :

<script type="text/javascript">
    var _iub = _iub || [];
    _iub.csConfiguration = {
        "lang": "en",
        "siteId": XXXXXX, //use your siteId
        "cookiePolicyId": YYYYYY, //use your cookiePolicyId
        "banner": {
            "position": "float-top-center",
            "acceptButtonDisplay": true,
            "customizeButtonDisplay": true
        },
        "callback": {
                  onPreferenceExpressedOrNotNeeded: function (preference) {
                    dataLayer.push({
                      iubenda_ccpa_opted_out: _iub.cs.api.isCcpaOptedOut(),
                    });

                    // preferences parameter may be undefined if both GDPR and LGPD do not apply
                    // we may need the line below to find USPR preferences instead of relying
                    // on preferences parameter
                    var otherPreferences = _iub.cs.api.getPreferences();

                    if (otherPreferences) {
                      var usprPreferences = otherPreferences.uspr;
                      if (usprPreferences) {
                        for (var purposeName in usprPreferences) {
                          if (usprPreferences[purposeName]) {
                            dataLayer.push({
                              event: 'iubenda_consent_given_purpose_' + purposeName,
                            });
                          }
                        }
                      }
                    }

                    if (!preference) {
                      dataLayer.push({
                        event: 'iubenda_preference_not_needed',
                      });
                    }
                    else if (preference.consent === true) {
                      dataLayer.push({
                        event: 'iubenda_consent_given',
                      });
                    }
                    else if (preference.consent === false) {
                      dataLayer.push({
                        event: 'iubenda_consent_rejected',
                      });
                    }
                    else if (preference.purposes) {
                      for (var purposeId in preference.purposes) {
                        if (preference.purposes[purposeId]) {
                          dataLayer.push({
                            event: 'iubenda_consent_given_purpose_' + purposeId,
                          });
                        }
                      }
                    }
                  }		
        }
    };
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Nous avons donc ajouté une fonction de rappel qui, au moment où l’utilisateur donne son consentement, exécute le code de Google Tag Manager afin de débloquer l’événement qui, d’après notre configuration, déclenchera l’activation de Google Analytics.

Maintenant que nous avons adapté le code pour intégrer Privacy Controls and Cookie Solution à Google Tag Manager, nous allons l’inclure dans nos pages avant la fermeture de la section BODY.

Options de configuration détaillée

Dans cette section, nous allons utiliser les « Variables » et les « Exceptions de déclencheurs » pour aller encore plus loin. Google Tag Manager vous permet de créer des variables et de définir des exceptions aux conditions de déclenchement d’une balise.

Vous pouvez considérer les exceptions comme des « déclencheurs de blocage ». Par exemple, si vous souhaitez que votre balise Google Analytics se déclenche uniquement sur la page du panier d’achats, vous pouvez définir une exception à la règle de déclenchement, de sorte que l’exécution de la balise ne soit pas déclenchée sur toute page qui n’est pas celle du panier d’achats. En définissant cette exception, vous bloquerez la balise et l’empêcherez de s’exécuter sur les autres pages. De la même façon, vous pouvez définir un déclencheur afin d’exécuter une balise uniquement lorsque des conditions relatives à une variable précise sont remplies.

Les variables et les exceptions vous apportent une plus grande flexibilité dans votre gestion des balises. Pour connaître l’avis de Google sur les exceptions, cliquez ici, et sur les variables, cliquez ici.

Publier un conteneur

Une fois vos règles définies, vous devrez publier le conteneur pour appliquer vos modifications sur votre site Web :

Pour cela, cliquez sur le bouton « Envoyer » dans le coin supérieur droit de la page d’aperçu du conteneur, puis confirmez.

Vous pouvez réutiliser ces exemples pour d’autres scripts ou des fonctions JavaScript.

Voir également

• Introduction au blocage préalable des cookies
• Aide-mémoire sur la conformité RGPD du consentement aux cookies
• Blocage préalable des cookies : balisage manuel (avec exemples pratiques)
• Comment gérer les cookies à des fins d’analyse et de publicité avec le Mode consentement de Google (alternative au blocage préalable)