Configurer le mode Consentement sur les sites Web

Cette page s'adresse aux développeurs qui gèrent leur propre solution de consentement sur leur site Web et qui souhaitent intégrer le mode Consentement. Pour en savoir plus sur le mode Consentement, consultez Présentation du mode Consentement. Si vous utilisez une plate-forme de gestion du consentement (PGC) pour obtenir le consentement des utilisateurs, découvrez comment configurer le mode Consentement avec une PGC.

Vous pouvez implémenter le mode Consentement de manière basique ou avancée. Consultez les directives de votre entreprise pour choisir une méthode d'implémentation et laquelle définir par défaut. En savoir plus sur les modes Consentement de base et avancé

Avant de commencer

Tenez compte des points suivants avant d'implémenter le mode Consentement :

  • Si vous utilisez Tag Manager et souhaitez gérer votre propre bannière, nous vous recommandons de charger votre bannière via le conteneur Tag Manager. Pour ce faire, vous devez créer un modèle de mode Consentement. Vous pouvez également utiliser un modèle du mode Consentement depuis la galerie de modèles de la communauté.

  • Si vous utilisez gtag.js, assurez-vous d'avoir inséré la balise Google sur chaque page de votre site Web. Le code du mode Consentement est ajouté à chaque page de votre site Web.

Pour configurer le mode Consentement :
  1. Avant qu'un utilisateur n'accorde son consentement: définissez l'état du consentement par défaut.
  2. Mettez à jour l'état du consentement en fonction de l'interaction de l'utilisateur avec vos paramètres de consentement.

Définissez une valeur par défaut pour chaque type de consentement que vous utilisez. Par défaut, aucune valeur n'est définie pour le mode Consentement.

Nous vous recommandons de limiter les paramètres de consentement par défaut aux régions dans lesquelles vous diffusez des bannières de consentement auprès de vos visiteurs. Cela permet de préserver les mesures dans les régions où les bannières de consentement sont requises et où les balises Google ajustent leur comportement en conséquence. Vous éviterez également toute perte de mesure lorsqu'il n'y a pas de bannières de consentement ou si les bannières de consentement ne s'appliquent pas. Consultez la section Comportement spécifique à une région.

gtag.js

Pour ajuster les fonctionnalités de mesure par défaut, appelez la commande gtag('consent', 'default', ...) sur chaque page de votre site avant toute commande qui envoie des données de mesure (telles que config ou event).

Par exemple, pour définir le refus de consentement pour tous les paramètres par défaut:

gtag('consent', 'default', {
  'ad_storage': 'denied',
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'analytics_storage': 'denied'
});

(Facultatif) Intégration aux plates-formes de gestion du consentement asynchrones

Si votre bannière se charge de manière asynchrone, elle ne s'exécute pas toujours avant vos balises Google. Pour gérer ces situations, spécifiez wait_for_update avec une valeur en millisecondes afin de contrôler le délai d'attente avant l'envoi des données.

Par exemple, pour refuser ad_storage par défaut sur une page spécifique, mais pour permettre à votre CMP de mettre à jour l'état du consentement, utilisez wait_for_update. Dans le code suivant, ad_storage est défini par défaut sur denied, et l'outil de consentement dispose de 500 millisecondes pour appeler gtag('consent', 'update', ...) avant le déclenchement des balises:

  gtag('consent', 'default', {
    'ad_storage': 'denied',
    'wait_for_update': 500
  });

Tag Manager

Lorsque vous utilisez Google Tag Manager, créez votre propre modèle à l'aide des API de consentement Tag Manager. Vous pouvez vous référer à l'exemple suivant comme point de départ.

Utilisez les API spécifiques à Tag Manager pour gérer les états de consentement setDefaultConsentState et updateConsentState. L'API gtagSet peut être utilisée pour éventuellement définir les paramètres ads_data_redaction et de transfert d'URL, le cas échéant.

gtag.js

Pour envoyer l'état du consentement de l'utilisateur, utilisez la commande update. Étant donné que le mode Consentement n'enregistre pas les choix de consentement, mettez à jour l'état du consentement dès qu'un utilisateur interagit avec votre solution de gestion du consentement. Une fois qu'un utilisateur a donné son consentement, conservez son choix et appelez la commande de mise à jour en conséquence sur les pages suivantes.

Il vous appartient de vous assurer que les valeurs correctes sont définies pour tous les types de consentement. Pour en savoir plus sur les types compatibles, consultez la documentation de référence de l'API.

L'exemple de code suivant montre comment mettre à jour l'état du consentement sur granted lorsque l'utilisateur accepte toutes les options:

<script>
function allConsentGranted() {
  gtag('consent', 'update', {
    'ad_user_data': 'granted',
    'ad_personalization': 'granted',
    'ad_storage': 'granted',
    'analytics_storage': 'granted'
  });
}
</script>
<!-- Invoke your consent function when a user interacts with your banner -->
<body>
  ...
  <button onclick="allConsentGranted()">Yes</button>
  ...
</body>

Tag Manager

Lorsque vous utilisez un modèle du mode Consentement, le consentement de l'utilisateur doit être automatiquement mis à jour lorsqu'il interagit avec la bannière.

Si vous créez vous-même un modèle de mode Consentement, utilisez les API spécifiques à Tag Manager pour gérer les états de consentement setDefaultConsentState et updateConsentState. L'API gtagSet peut éventuellement être utilisée pour définir ads_data_redaction et les paramètres de transfert d'URL appropriés.

Exemple d'implémentation

L'exemple suivant définit plusieurs paramètres du mode Consentement sur denied par défaut. Une fois qu'un utilisateur a indiqué ses choix de consentement, les paramètres pertinents sont remplacés par granted.

gtag.js

Ici, l'ordre du code est essentiel. Si votre code de consentement est appelé dans le désordre, les paramètres de consentement par défaut ne fonctionneront pas. Les spécificités peuvent varier en fonction des exigences métier, mais en général, le code doit s'exécuter dans l'ordre suivant:

  1. Chargez la balise Google. Il s'agit de votre extrait de code par défaut. L'extrait par défaut doit être mis à jour (voir ci-dessous) pour inclure un appel à gtag('consent', 'default', ...).

  2. Chargez votre solution de consentement. Si votre solution de consentement se charge de manière asynchrone, consultez la section Intégrer les plates-formes de gestion du consentement asynchrone pour vous assurer que tout se passe dans le bon ordre.

  3. Si votre solution de consentement n'est pas gérée par votre solution, appelez gtag('consent', 'update', ...) après que l'utilisateur a donné son consentement.

<script>
// Define dataLayer and the gtag function.
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

// Set default consent to 'denied' as a placeholder
// Determine actual values based on your own requirements
gtag('consent', 'default', {
  'ad_storage': 'denied',
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'analytics_storage': 'denied'
});
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID">
</script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());
  gtag('config', 'TAG_ID');
</script>

<!-- Create one update function for each consent parameter -->
<script>
  function consentGrantedAdStorage() {
    gtag('consent', 'update', {
      'ad_storage': 'granted'
    });
  }
</script>
<!-- Invoke your consent functions when a user interacts with your banner -->
<body>
  ...
  <button onclick="consentGrantedAdStorage">Yes</button>
  ...
</body>

Tag Manager

Pour les sites qui utilisent Tag Manager, nous vous recommandons d'utiliser une CMP pour gérer les modifications des choix de consentement des visiteurs. Les CMP fournissent des modèles dans la galerie de modèles de la communauté pour créer une balise permettant de gérer le mode Consentement.

Si vous ne pouvez pas utiliser un modèle, vous pouvez plutôt mettre à jour le code de votre page comme suit. Ici, l'ordre du code est essentiel. Si votre code de consentement est appelé dans le désordre, les paramètres de consentement par défaut ne fonctionneront pas.

<script>
  // Define dataLayer and the gtag function.
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}

  // Set default consent to 'denied' as a placeholder
  // Determine actual values based on your own requirements
  gtag('consent', 'default', {
    'ad_storage': 'denied',
    'ad_user_data': 'denied',
    'ad_personalization': 'denied',
    'analytics_storage': 'denied'
  });
</script>

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXX');</script>
<!-- End Google Tag Manager -->

<!-- Create one update function for each consent parameter -->
<script>
  function consentGrantedAdStorage() {
    gtag('consent', 'update', {
      'ad_storage': 'granted'
    });
  }
</script>
<!-- Invoke your consent functions when a user interacts with your banner -->
<body>
  ...
  <button onclick="consentGrantedAdStorage()">Yes</button>
  ...
</body>

Google s'engage de façon continue en faveur d'un écosystème de publicité digitale respectueux de la confidentialité. Dans cette optique, nous renforçons l'application de nos Règles relatives au consentement de l'utilisateur dans l'UE.

Découvrez les modifications apportées au mode Consentement pour le trafic dans l'Espace économique européen (EEE).

Les utilisateurs du mode Consentement doivent envoyer deux nouveaux paramètres en plus de ad_storage et analytics_storage:

Nom du champ Valeurs autorisées Description
ad_user_data 'granted' | 'denied' Définit le consentement pour l'envoi à Google de données utilisateur liées à la publicité.
ad_personalization 'granted' | 'denied' Définit le consentement pour la publicité personnalisée.

Les fonctionnalités avancées de consentement permettent d'effectuer les actions suivantes:

  • Définissez les services Google avec lesquels vous partagez des données à l'aide de l'UI de la balise Google.
  • Définissez le comportement pour une zone géographique.
  • Transmettre des informations sur les clics sur les annonces, les ID client et les ID de session dans les URL lorsque les utilisateurs n'ont pas accordé leur consentement pour les cookies.
  • Masquer entièrement (supprimer) les informations sur les annonces lorsque les utilisateurs refusent les cookies publicitaires.

Comportement spécifique à la région

Pour modifier le comportement par défaut de vos balises pour les utilisateurs de certaines régions, spécifiez une région dans votre commande de consentement. En indiquant une valeur pour la région, vous pouvez ajuster les valeurs par défaut en fonction de l'emplacement géographique de vos utilisateurs. Pour en savoir plus sur l'identification des régions, consultez la section ID géographiques.

gtag.js

L'exemple suivant définit analytics_storage sur denied pour les utilisateurs situés en Espagne et en Alaska, et ad_storage sur denied pour tous les utilisateurs.

  gtag('consent', 'default', {
    'analytics_storage': 'denied',
    'region': ['ES', 'US-AK']
  });

  gtag('consent', 'default', {
    'ad_storage': 'denied'
  });

Tag Manager

Si vous utilisez un modèle pour créer votre balise, il peut être doté de commandes permettant de définir un comportement spécifique à la région. Si vous créez vous-même une balise de modèle, consultez Créer un modèle pour le mode Consentement pour savoir comment définir un comportement spécifique à une région.

Le paramètre le plus spécifique est prioritaire

Si deux commandes de consentement par défaut se produisent sur la même page avec des valeurs pour une région et une sous-région, celle associée à une région plus spécifique prend effet. Par exemple, si ad_storage est défini sur granted pour la région US-CA et ad_storage sur denied pour la région US-CA, le paramètre plus spécifique de cet État sera appliqué à un visiteur situé en Californie. Pour cet exemple, cela signifie qu'un visiteur provenant du Canada en Californie aurait ad_storage défini sur denied.

Région ad_storage Comportement
États-Unis 'granted' S'applique aux utilisateurs aux États-Unis qui ne sont pas au Canada
US-CA 'denied' S'applique aux utilisateurs situés au Canada
Non spécifiée 'granted' Utilise la valeur par défaut de 'granted'. Dans cet exemple, s'applique aux visiteurs qui ne se trouvent pas au Canada ou aux États-Unis.

Transmettre dans les URL des informations sur les clics sur les annonces, l'ID client et l'ID de session

Lorsqu'un utilisateur accède à votre site Web après avoir cliqué sur une annonce, des informations sur cette annonce peuvent être ajoutées aux URL de vos pages de destination en tant que paramètre de requête. Pour améliorer la précision des conversions, ces informations sont généralement stockées dans des cookies propriétaires de votre domaine.

Toutefois, si ad_storage est défini sur denied, ces informations ne seront pas stockées localement. Pour améliorer la qualité de la mesure des clics sur les annonces lorsque ad_storage est défini sur denied, vous pouvez éventuellement choisir de transmettre des informations sur les clics sur les annonces via les paramètres d'URL sur les pages à l'aide du transfert d'URL.

De même, si analytics_storage est défini sur denied, le transfert d'URL peut être utilisé pour envoyer des données analytiques basées sur les événements et les sessions (y compris les conversions) sans cookies sur les différentes pages.

Pour utiliser le transfert d'URL, les conditions suivantes doivent être remplies:

  • Votre balise Google tient compte du consentement et est présente sur la page.
  • L'annonceur a activé la fonctionnalité de transfert d'URL.
  • Le mode Consentement est implémenté sur la page.
  • Le lien sortant renvoie au même domaine que celui de la page active.
  • L'URL contient un GCLID ou un DCLID (balises Google Ads et Floodlight uniquement)

gtag.js

Pour activer cette fonctionnalité, définissez le paramètre url_passthrough sur true. Ajoutez la commande suivante à l'extrait par défaut avant toute commande config:

gtag('set', 'url_passthrough', true);

Tag Manager

Si vous utilisez un modèle pour créer votre balise, il est possible qu'il offre des commandes permettant de définir le transfert d'URL. Si vous créez vous-même un modèle de balise, consultez Créer un modèle pour le mode Consentement pour savoir comment définir le passthrough d'URL à l'aide de l'API de modèle personnalisé gtagSet.

Vous pouvez également utiliser les options suivantes pour le définir dans les balises Conversion Linker et/ou Analytics.

Pour les balises Google Ads et Floodlight:

Pour activer cette fonctionnalité, créez (ou utilisez une balise Conversion Linker) et assurez-vous que la case Activer l'association sur toutes les URL de page est cochée. Pour savoir comment créer une balise Conversion Linker, consultez la section Configuration de base.

Pour les balises Google Analytics:

  1. Dans Tag Manager, accédez à Champs à définir :
  2. Lorsque la section "Champs à définir" est développée, cliquez sur Ajouter une ligne.
  3. Pour Nom du champ, saisissez la valeur correcte :
    • Pour les balises Google Analytics: Configuration GA4, saisissez url_passthrough.
    • Pour les balises Google Analytics: Universal Analytics qui utilisent les variables de paramètres Google Analytics, saisissez urlPassthrough.
  4. Dans le champ Valeur, saisissez "true".
  5. Enregistrez la balise et publiez-la.

Vous pouvez également définir le paramètre url_passthrough sur true sur chaque page de votre site avant l'extrait d'installation GTM.

window.dataLayer = window.dataLayer || [];
function gtag(){window.dataLayer.push(arguments);}
gtag('set', 'url_passthrough', true);

Lorsque vous utilisez le transfert d'URL, quelques paramètres de requête peuvent être ajoutés aux liens lorsque les utilisateurs parcourent les pages de votre site Web:

  • gclid
  • dclid
  • gclsrc
  • _gl
  • wbraid

Pour des résultats optimaux, vérifiez les points suivants:

  1. Les redirections sur votre site transmettent tous les paramètres de requête ci-dessus.
  2. Vos outils d'analyse ignorent ces paramètres dans les URL des pages.
  3. Ces paramètres n'interfèrent pas avec le comportement de votre site.

Masquer les données relatives aux annonces

Lorsque ad_storage est défini sur denied, les nouveaux cookies ne sont pas définis à des fins publicitaires. De plus, les cookies tiers précédemment définis sur google.com et doubleclick.net ne seront pas utilisés, sauf à des fins de spam et de fraude. Les données envoyées à Google continueront d'inclure l'URL complète de la page, y compris les informations concernant les clics sur les annonces dans les paramètres d'URL.

gtag.js

Pour masquer davantage les données de vos annonces lorsque ad_storage est défini sur denied, définissez ads_data_redaction sur true.

gtag('set', 'ads_data_redaction', true);

Lorsque ads_data_redaction est défini sur true et ad_storage sur denied, les identifiants de clic sur une annonce envoyés dans les requêtes réseau par Google Ads et les balises Floodlight sont masqués. Les requêtes réseau seront aussi envoyées via un domaine sans cookie.

Tag Manager

Si vous utilisez un modèle pour créer votre balise, celui-ci peut permettre de masquer davantage les données relatives aux annonces. Si vous créez vous-même un modèle de balise, consultez Créer un modèle pour le mode Consentement pour en savoir plus sur le masquage des données relatives aux annonces.

Étapes suivantes

Anciennes commandes de balises

Si vous utilisez d'anciennes balises, telles que ga.js, analytics.js ou conversion.js, passez à gtag.js ou Google Tag Manager.

Pour en savoir plus sur les paramètres de confidentialité des autres anciennes balises, consultez la documentation suivante: