Documentation FitConsent CMP

Trouvez tout ce dont vous avez besoin pour démarrer avec FitConsent Plateforme de gestion du consentement CMP, de l’installation à l’utilisation avancée.

Introduction

Bienvenue dans la documentation de FitConsent Plateforme de gestion du consentement.

Qu’est-ce qu’une Plateforme de Gestion du Consentement (CMP) ?

Une Plateforme de gestion du consentement CMP est un outil qui aide les sites web à collecter et à gérer légalement le consentement des utilisateurs pour le traitement des données, ce qui est une exigence des lois sur la confidentialité comme le RGPD en Europe et le CCPA/CPRA en Californie. C’est la technologie qui alimente les ‘bannières de cookies’ que vous voyez sur de nombreux sites web.

FitConsent va au-delà d’une simple bannière. Il vous fournit les outils pour non seulement vous conformer à la loi, mais aussi pour optimiser l’expérience utilisateur afin de renforcer la confiance et d’améliorer les taux de consentement. Notre service inclut une prise en charge complète et automatique du mode de consentement V2 de Google et du mode de consentement UET de Microsoft, garantissant que vos balises d’analyse et de marketing ajustent leur comportement en fonction du consentement de l’utilisateur, Cette mise en œuvre est détaillée dans le guide de Google sur la configuration du mode de consentement sur les sites web. Cette adaptabilité est essentielle pour maintenir un marketing axé sur les données dans un monde où la protection de la vie privée est primordiale.

Installation et configuration

L’intégration de FitConsent est conçue pour être rapide et simple. Il vous suffit d’ajouter un seul extrait de script à la section de votre site web. Ce script gère tout, de l’affichage de la bannière à la gestion des paramètres par défaut du mode de consentement de Google et Microsoft.

Prérequis important : Mode de consentement

Notre script configure automatiquement les paramètres par défaut nécessaires pour le mode de consentement v2 de Google et le mode de consentement UET de Microsoft. C’est crucial pour que des services comme Google Analytics et Microsoft Advertising fonctionnent de manière conforme au consentement de l’utilisateur. Assurez-vous que ce script est placé le plus haut possible dans la balise de votre site web, avant tout autre script susceptible d’utiliser des cookies.

Intégration directe

Pour une installation directe, copiez l’extrait de code ci-dessous et collez-le dans la section <head> du HTML de votre site web. Il est crucial de le placer aussi haut que possible, avant tout autre script susceptible de définir des cookies (comme Google Analytics ou Microsoft UET).

Google Tag Manager (Recommandé)

L’utilisation de notre modèle de communauté Google Tag Manager (GTM) est la méthode recommandée pour installer FitConsent. Il gère correctement le mode de consentement v2 de Google et garantit que les balises se déclenchent en fonction du consentement de l’utilisateur.

Étape 1 : Activer l’aperçu du consentement (configuration unique)
  • 1. Dans votre espace de travail GTM, cliquez sur l’onglet « Admin ».
  • 2. Sous la colonne « Conteneur », cliquez sur « Paramètres du conteneur ».
  • 3. Dans la section « Paramètres supplémentaires », cochez la case « Activer l’aperçu du consentement ».
  • 4. Cliquez sur « Enregistrer » dans le coin supérieur droit.
Étape 2 : Ajouter le modèle FitConsent
  • 1. Allez dans la section « Modèles » dans la barre latérale gauche.
  • 2. Dans la boîte « Modèles de balises », cliquez sur « Rechercher dans la galerie ».
  • 3. Recherchez « FitConsent » et cliquez sur « Ajouter à l’espace de travail ».
  • 4. Confirmez les autorisations pour ajouter le modèle.
Étape 3 : Créer une balise « Google Consent Default »
  • 1. Allez dans « Balises » et cliquez sur « Nouvelle ».
  • 2. Nommez la balise « FitConsent – Consentement par défaut ».
  • 3. Cliquez sur « Configuration de la balise » et choisissez « FitConsent » dans la liste.
  • 4. Dans le menu déroulant « Type de balise », sélectionnez « Google Consent Default ». Cela définira les paramètres par défaut pour Google et Microsoft.
  • 5. Dans le champ « FitConsent Website ID », collez votre ID de site web unique depuis votre tableau de bord.
  • 6. Pour le déclencheur, sélectionnez l’option intégrée « Initialisation du consentement – Toutes les pages ». C’est crucial.
  • 7. Enregistrez la balise.
Étape 4 : Créer la balise « FitConsent Banner Loader »
  • 1. Créez une autre balise « Nouvelle ». Nommez-la « FitConsent – Chargement de la bannière ».
  • 2. Cliquez sur « Configuration de la balise » et choisissez à nouveau « FitConsent ».
  • 3. Le « Type de balise » devrait être par défaut « FitConsent Banner Loader ».
  • 4. Dans le champ « FitConsent Website ID », collez votre ID de site web unique depuis votre tableau de bord.
  • 5. Pour le déclencheur, sélectionnez également « Initialisation du consentement – Toutes les pages ».
  • 6. Enregistrez la balise.

Étape 5 : Configurer votre balise Google

La dernière étape consiste à s’assurer que votre balise Google principale (qui envoie des données à Google Analytics) se déclenche correctement en fonction du consentement de l’utilisateur.

A) Si vous avez déjà une balise Google (par exemple, « G-XXXXXXXXXX ») dans votre conteneur :
  • 1. Cliquez sur votre balise Google pour la modifier.
  • 2. Allez dans « Paramètres avancés » > « Paramètres de consentement ».
  • 3. Assurez-vous que « Aucun consentement supplémentaire requis » est sélectionné. Le modèle FitConsent gère les signaux de consentement pour vous.
  • 4. Enregistrez les modifications de votre balise.
B) Si vous n’avez PAS encore de balise Google :
  • 1. Cliquez sur « Balises » > « Nouvelle ».
  • 2. Nommez la balise « Google Tag – GA4 » ou similaire.
  • 3. Pour « Configuration de la balise », choisissez « Balise Google ».
  • 4. Saisissez votre ID de mesure GA4 dans le champ « ID de balise » (par exemple, « G-XXXXXXXXXX »).
  • 5. Pour « Déclenchement », sélectionnez « Initialisation – Toutes les pages ».
  • 6. Allez dans « Paramètres avancés » > « Paramètres de consentement » et assurez-vous que « Aucun consentement supplémentaire requis » est sélectionné.
  • 7. Enregistrez la balise.
Étape 6 : Gérer les autres scripts (par exemple, Microsoft Clarity, Facebook Pixel)

L’intégration de FitConsent avec le mode de consentement de Google vous permet de gérer n’importe quel script tiers via GTM. Voici comment vous pourriez configurer une balise comme Microsoft Clarity :

  • 1. Ajouter la balise : Ajoutez votre balise tierce à GTM (soit via un modèle de communauté, soit en tant que balise HTML personnalisée).
  • 2. Configurer les paramètres de consentement : Modifiez la balise, allez dans « Paramètres avancés » > « Paramètres de consentement ».
  • 3. Ajouter une vérification de consentement : Sélectionnez « Exiger un consentement supplémentaire pour que la balise se déclenche ». Un tableau apparaîtra.
  • 4. Choisir le type de consentement : Cliquez sur « Ajouter un consentement requis » et sélectionnez le type de consentement approprié. Pour un outil d’analyse comme Clarity, vous choisiriez analytics_storage. Pour un script de marketing comme un Facebook Pixel ou une balise Microsoft UET, vous pourriez ajouter à la fois ad_storage et analytics_storage.
  • 5. Définir le déclencheur : Définissez le déclencheur de la balise pour qu’elle se déclenche sur votre événement de vue de page standard (par exemple, « Initialisation – Toutes les pages » ou un événement « Vue de page » personnalisé).

Maintenant, GTM vérifiera automatiquement l’état du consentement fourni par FitConsent. La balise Microsoft Clarity ne se déclenchera qu’après que l’utilisateur aura accepté la catégorie « Analyse » sur votre bannière de consentement, et une balise UET ne se déclenchera que si « Marketing » est accepté.

Enfin, cliquez sur « Soumettre » et « Publier » votre conteneur GTM pour rendre les modifications effectives.

Plugin WordPress FitConsent CMP

S’intègre à FitConsent avec WordPress et l’API de consentement WP pour une compatibilité transparente avec Google Site Kit.

FitConsent est une Plateforme de Gestion du Consentement (CMP) puissante mais simple, conçue pour vous aider à vous conformer aux réglementations en matière de confidentialité comme le RGPD et le CCPA. Ce plugin facilite grandement l’ajout de la bannière FitConsent sur votre site WordPress. Plus important encore, il offre une compatibilité automatique et prête à l’emploi avec l’API de consentement WP, qui est la norme utilisée par Google Site Kit.

En utilisant ce plugin, vous pouvez activer la fonctionnalité de mode de consentement de Google Site Kit et être certain que les choix de consentement de vos utilisateurs sont respectés, ce qui permet des analyses et un suivi publicitaire conformes et efficaces.

Fonctionnalités clés

  • Configuration simple : Entrez simplement votre ID de site web FitConsent et le plugin s’occupe du reste.
  • Prêt pour Google Site Kit : Fonctionne de manière transparente avec le mode de consentement de Google Site Kit en s’intégrant à l’API de consentement WP.
  • Léger : Le plugin est épuré et n’ajoute aucune surcharge à votre site web.
  • Communication standardisée : Garantit que les signaux de consentement sont transmis correctement entre votre bannière de consentement et les autres plugins.

Guide d’installation

Méthode 1 : Installation via le tableau de bord WordPress
  1. Connectez-vous à votre tableau de bord WordPress.
  2. Naviguez vers Extensions > Ajouter.
  3. Dans la barre de recherche, tapez « FitConsent CMP » et appuyez sur Entrée.
  4. Trouvez le plugin « FitConsent CMP » dans les résultats de recherche et cliquez sur Installer maintenant.
  5. Après l’installation, cliquez sur Activer.
Méthode 2 : Installation manuelle via FTP
  1. Téléchargez le plugin FitConsent CMP depuis la source officielle.
  2. Décompressez le fichier téléchargé pour extraire le dossier fitconsent-cmp.
  3. Connectez-vous au serveur de votre site web à l’aide d’un client FTP (par exemple, FileZilla).
  4. Naviguez jusqu’au répertoire /wp-content/plugins/.
  5. Téléchargez le dossier fitconsent-cmp complet dans ce répertoire.
  6. Retournez à votre tableau de bord WordPress, naviguez vers Extensions > Extensions installées, et cliquez sur Activer pour « FitConsent CMP ».

Configuration après l’installation

  1. Dans votre tableau de bord WordPress, allez dans Réglages > FitConsent.
  2. Trouvez votre ID de site web FitConsent dans votre tableau de bord FitConsent.
  3. Entrez cet ID dans le champ prévu à cet effet et cliquez sur Enregistrer les modifications.
Intégration avec Google Site Kit (le cas échéant)
  1. Si vous utilisez le plugin Google Site Kit, accédez à ses réglages.
  2. Assurez-vous que l’option Mode de consentement est activée.

Autres plateformes (CMS)

Vous pouvez utiliser FitConsent avec n’importe quel site web ou système de gestion de contenu (CMS) comme WordPress ou Shopify qui vous permet d’ajouter du code HTML ou JavaScript personnalisé. Nous vous recommandons vivement d’utiliser leur intégration Google Tag Manager si elle est disponible et de suivre les instructions GTM ci-dessus. Sinon, vous pouvez utiliser la méthode « Intégration directe ».

Plateforme de gestion du consentement: Configuration de votre bannière

Personnalisez l’apparence, le contenu et le comportement de la bannière depuis votre tableau de bord.

Paramètres généraux

Cadre : Choisissez la principale réglementation de confidentialité à laquelle vous devez vous conformer (par exemple, RGPD, CCPA). Ce choix ajuste le comportement par défaut de la bannière et les options disponibles pour s’aligner sur les exigences de ce cadre.

Configuration du Mode de Consentement

Ce guide explique comment configurer la Plateforme de Gestion du Consentement (CMP) FitConsent pour votre site web. FitConsent propose deux modes de configuration distincts — Avancé et Basique — vous offrant la flexibilité nécessaire pour équilibrer les besoins en données marketing avec une stricte conformité à la confidentialité.

1. Choisir Votre Mode de Configuration

Avant l’installation, décidez quel mode correspond le mieux à votre entreprise et à vos exigences réglementaires.

Mode Avancé (Recommandé)

Idéal pour : Le marketing axé sur les données, l’optimisation de Google Ads et Google Analytics 4 (GA4).

En Mode Avancé, les balises Google se chargent immédiatement mais respectent strictement les signaux de confidentialité.

  • Avant le Consentement : Les balises se chargent mais envoient des « pings sans cookie » (signaux anonymes) avec le consentement refusé. Aucun cookie n’est défini.
  • Après le Consentement : Les balises passent à des capacités complètes de collecte de données.
  • Avantage : Active la Modélisation des Conversions de Google, récupérant les données perdues pour l’attribution même lorsque les utilisateurs refusent les cookies.

Mode Basique (Confidentialité Stricte)

Idéal pour : Les politiques de confidentialité très strictes ou les juridictions exigeant zéro transmission de données avant le consentement.

En Mode Basique, toutes les balises Google sont complètement bloquées jusqu’à ce que l’utilisateur accorde activement son consentement.

  • Avant le Consentement : Aucune balise Google n’est exécutée. Aucune donnée n’est envoyée aux serveurs Google.
  • Après le Consentement : Les scripts sont débloqués et se chargent normalement.
  • Compromis : Vous perdez toutes les données des utilisateurs qui ne donnent pas leur consentement, y compris les données de modélisation anonymes.

2. Configuration du Mode Avancé (Par Défaut)

Ceci est la configuration par défaut pour FitConsent. Elle ne nécessite aucune modification de vos balises Google existantes.

Étape 1 : Configurer les Paramètres

Assurez-vous que votre configuration FitConsent est définie sur ‘advanced’.

Étape 2 : Installer le Code d’Intégration

Copiez le code d’intégration du Mode Avancé depuis votre tableau de bord FitConsent. Il doit être placé avant vos balises Google dans le <head> de votre site web.

(Image de la structure du code HTML montrant le script FitConsent placé avant le script Google Analytics)

HTML

Étape 3 : Vérification

  1. Chargez votre site web dans une fenêtre privée/incognito.
  2. Ouvrez les Outils de Développement (F12) > Onglet Réseau (Network).
  3. Vous devriez voir des requêtes vers Google Analytics (collect?v=2...) immédiatement, même avant de cliquer sur « Accepter ».
  4. Vérifiez la charge utile de la requête pour gcs=. Elle doit indiquer un consentement refusé (par exemple, G100).

3. Configuration du Mode Basique (Blocage Strict)

Cette configuration empêche le déclenchement de toute balise Google jusqu’à ce que le consentement soit donné. Cela nécessite de modifier manuellement vos scripts de balises Google.

Étape 1 : Configurer les Paramètres

Changez votre configuration FitConsent pour ‘basic’.

Étape 2 : Installer le Code d’Intégration

Utilisez le code d’intégration du Mode Basique. Notez qu’il n’inclut pas le script de signaux de consentement par défaut que l’on trouve dans le Mode Avancé.

HTML

Étape 3 : Bloquer Vos Balises Google

Vous devez modifier manuellement vos scripts Google Analytics ou Tag Manager pour les empêcher de s’exécuter automatiquement.

  • Changez type="text/javascript" (ou par défaut) en type="text/plain".
  • Ajoutez l’attribut data-cookieconsent correspondant à la catégorie de la balise (par exemple, « analytics » ou « marketing »).

Avant (Balise Google Standard) :

HTML

Après (Balise Google Bloquée) :

HTML

Guide de Correspondance des Catégories :

  • data-cookieconsent="analytics" → À utiliser pour Google Analytics (GA4)
  • data-cookieconsent="marketing" → À utiliser pour Google Ads, Pixel Facebook, LinkedIn Insight
  • data-cookieconsent="functional" → À utiliser pour les Chatbots ou les outils de personnalisation

Étape 4 : Vérification

  1. Effacez les cookies de votre navigateur et chargez votre page.
  2. Ouvrez les Outils de Développement > Onglet Réseau (Network).
  3. Assurez-vous qu’aucune requête Google Analytics n’apparaît.
  4. Cliquez sur « Accepter » sur le bandeau.
  5. Vérifiez que le script Google Analytics se charge maintenant et que la requête apparaît dans l’onglet Réseau.

4. Dépannage et Tests

Utilisez le paramètre de débogage (debug) pour vérifier votre installation.

Ajoutez ?fitconsent_debug=true à votre URL (par exemple, https://votresite.com?fitconsent_debug=true).

  • En Mode Avancé : La console devrait confirmer : ✅ « Consent defaults loaded before Google tags. » (Paramètres de consentement par défaut chargés avant les balises Google).
  • En Mode Basique : La console suivra le moment où les scripts bloqués sont débloqués après l’octroi du consentement.

Note de Migration

Si vous passez du mode Avancé au mode Basique :

  1. Mettez à jour votre paramètre de configuration.
  2. Retirez le bloc de script « Consent Default » de votre code.
  3. Ajoutez manuellement type="text/plain" à toutes vos balises de suivi.
  4. Effacez vos cookies et testez.

Tableau Comparatif

FonctionnalitéMode BasiqueMode Avancé
Balises GoogleBloquées jusqu’au consentementChargement immédiat (restreint)
Données Pré-consentementZéro donnée collectéePings sans cookie (modélisation)
Niveau de ConfidentialitéLe plus strictÉquilibré (conforme RGPD/DMA)
Mise en œuvreNécessite des modifications manuelles des balisesSimple copier-coller
Modélisation des Conversions❌ Non disponible✅ Disponible

Ciblage géographique (Premium) : Choisissez d’afficher la bannière uniquement aux visiteurs de régions spécifiques, comme l’UE.

Mise en page : Sélectionnez entre une bannière flottante (à différentes positions de l’écran) ou un dialogue centré qui se superpose à votre contenu.

Plateforme de gestion du consentement Paramètres généraux

Apparence

Personnalisez les couleurs, les polices et l’élévation (ombres) pour qu’ils correspondent parfaitement à l’apparence et à la convivialité de votre marque.

Logo et image d’arrière-plan : Vous pouvez également ajouter le logo de votre entreprise ou même une image d’arrière-plan à la bannière pour une expérience entièrement personnalisée.

Plateforme de gestion du consentement Apparence

Contenu et langues

Modifiez tout le texte de la bannière et du modal de préférences. FitConsent prend en charge plusieurs langues, vous permettant d’offrir une expérience native à tous vos utilisateurs. Le Markdown de base est pris en charge dans les champs de texte principaux.

Plateforme de gestion du consentement Contenu et langues

Optimisation basée sur l’IA

Utilisez notre optimiseur basé sur l’IA pour obtenir des suggestions de couleurs, de texte et de mises en page qui ont fait leurs preuves pour augmenter les taux de consentement en fonction du contenu de votre site web et de votre public cible.

Plateforme de gestion du consentement Optimisation basée sur l'IA

FitConsent peut afficher une liste détaillée et à mise à jour automatique des cookies et autres éléments de stockage que votre site utilise. Ceci est souvent inclus sur une page de politique de confidentialité pour offrir une transparence totale à vos utilisateurs.

Intégration de la déclaration

Pour afficher la déclaration de cookies, vous devez ajouter un simple élément <div> à votre page là où vous souhaitez que le tableau apparaisse, puis inclure notre script de déclaration. Vous pouvez trouver l’extrait de code exact pour votre site web dans l’onglet ‘Déclaration de cookies’ de la page de configuration de votre site web.

Pour les sites web HTML standard, ou les sites web construits avec des CMS comme WordPress (sans frontend React headless), vous pouvez ajouter l’extrait suivant directement dans le HTML de votre page.

Le script trouvera automatiquement la <div> avec l’ID fitconsent-declaration et y injectera le tableau de cookies.

Pour éviter les « erreurs d’hydratation » dans les frameworks basés sur React comme Next.js, il est crucial que le script de déclaration ne modifie pas la page avant que React n’ait terminé son rendu initial côté client.

La manière recommandée d’y parvenir est de créer un composant côté client dédié qui charge le script à l’aide d’un hook useEffect.

  1. Créer un composant client

Créez un nouveau fichier de composant, par exemple StorageDeclarationEmbed.tsx. Assurez-vous d’inclure la directive "use client"; en haut.

2. Utiliser le composant sur votre page

Maintenant, vous pouvez importer et utiliser ce composant sur n’importe quelle page, comme votre page de politique de confidentialité.

Cette approche garantit que le script est chargé et exécuté en toute sécurité côté client, évitant ainsi tout conflit avec le cycle de vie du rendu de React.

Plateforme de gestion du consentement: Utilisation avancée

Utiliser les données de consentement et comprendre le comportement de la bannière.

Utiliser les données de consentement sur votre site web

Après qu’un utilisateur a interagi avec la bannière, FitConsent stocke ses choix et ses données de géolocalisation dans un cookie nommé fitconsent_given. Vous pouvez lire ce cookie côté client ou côté serveur pour adapter l’expérience utilisateur.

Structure du cookie

Le cookie contient un objet JSON avec deux clés principales : choices et geo.

choices : Un objet où les clés sont les catégories de consentement (par exemple, marketing, analytics) et les valeurs sont true ou false.

geo : Un objet contenant les informations géographiques de l’utilisateur (par exemple, code de pays, état) au moment du consentement.


Exemple : Afficher un composant en fonction du consentement

Voici comment vous pourriez afficher une bannière promotionnelle spéciale uniquement aux utilisateurs de Californie qui ont consenti aux cookies de marketing.

Détection automatique de la langue

La bannière FitConsent détecte automatiquement la langue préférée de l’utilisateur et affiche la traduction appropriée si vous en avez fourni une. Ce processus suit un ordre de priorité spécifique :

  • 1. Il vérifie d’abord l’attribut lang sur la balise html de votre site web (par exemple, <html lang= »fr »>). C’est la méthode la plus fiable.
  • 2. Si l’attribut lang n’est pas présent, il utilisera les paramètres de langue du navigateur de l’utilisateur (navigator.language).
  • 3. Si aucune des méthodes ci-dessus ne correspond aux langues que vous avez configurées, il reviendra à l’anglais (en) ou à la première langue de votre liste sélectionnée.
Meilleure pratique

Pour de meilleurs résultats sur les sites multilingues, assurez-vous que la balise <html> de votre page reflète correctement la langue actuelle affichée à l’utilisateur.