Cookiebot CMP

1Role / Objectif

Ce setup permet :

• Conformite RGPD / ePrivacy pour les visiteurs EU
• Consent Mode v2 avec defaults Denied
• Controle granulaire par categorie (analytics, marketing, preferences)
• Synchronisation consent vers toutes les destinations (GTM, Shopify Privacy API)
• Aucun tracking marketing sans consentement explicite

2Architecture Consent

Flux complet du consentement

Addingwell injecte GTM
        ↓
GTM charge Cookiebot (Consent Initialization)
        ↓
Cookiebot affiche la banniere
        ↓
Utilisateur donne / refuse son consent
        ↓
Consent Mode v2 update (ad_storage, analytics_storage...)
        ↓
Tags GTM fires selon le consent
        ↓
Bridge → Shopify Privacy API (web/custom pixels)

Chaine d'integration

1. 1Addingwell injecte GTM sur toutes les pages du store
2. 2GTM charge le tag Cookiebot CMP sur le trigger Consent Initialization (avant tout tracking)
3. 3Cookiebot affiche le banner, collecte le consent, et active le Consent Mode v2
4. 4GTM autorise ou bloque les tags (GA4, Meta, Google Ads, etc.) selon le consent

Principes fondamentaux

• Cookiebot est le seul CMP — pas de double banniere
• Consent defaults a Denied pour toutes les categories
• Les tags GTM attendent le consent update avant de fire
• Le bridge synchronise le consent vers Shopify pour les pixels
• La banniere Shopify native doit etre desactivee
• Cookiebot est charge via GTM (Addingwell) — pas de script dans le theme
• Pas besoin de l'app Shopify Cookiebot ni de l'integration Shopify dans le dashboard Cookiebot

3Configuration Dashboard

Creer le compte Cookiebot

1. 1S'inscrire sur cookiebot.com
2. 2Ajouter le domaine du store
3. 3Recuperer le Domain Group ID (CBID) : Cookiebot > Settings > Domain Group
4. 4Noter le CBID — il sera utilise dans le tag GTM

Configuration dashboard (cookiebot.com)

Configuration banner (Cookiebot > Banner)

Le banner consent s'affiche sur toutes les pages a la premiere visite. Il est charge par GTM via le tag Cookiebot CMP — pas de script dans le theme.

Privacy Trigger

Le Privacy Trigger est le petit bouton flottant permettant de modifier son consent. Le desactiver (OFF) car la gestion du consent est accessible via la page /pages/politique-de-cookies et le lien dans le footer.

Declaration

4Bridge Consent (Shopify Privacy API)

Pourquoi un bridge ?

Cookiebot gere le consent pour GTM. Mais les web pixels et custom pixels Shopify utilisent la Shopify Customer Privacy API. Le bridge synchronise les deux.

Fonctionnement

Cookiebot consent update
        ↓
Event CookiebotOnConsentReady
        ↓
Bridge lit Cookiebot.consent.marketing
        ↓
Shopify.customerPrivacy.setTrackingConsent({
  marketing: true/false
})
        ↓
Web pixels Shopify fires / bloques

Etape 1 — Creer le snippet

Creer un snippet cookie-consent_boostecom.liquid et coller le code suivant :

<script>
/**
 * Cookiebot → Shopify Customer Privacy Sync (EU/US, Prod)
 *
 * - Charge l'API Shopify "consent-tracking-api"
 * - Deny-by-default tant que Cookiebot n'a pas fourni le consentement
 * - Sync Cookiebot → Shopify sur chaque événement (ready/accept/decline)
 * - Retry loop pour gérer le chargement asynchrone
 */
(function () {
  "use strict";

  var CONSENT_PROFILE = "EU"; // "EU" or "US"

  var CFG = {
    defaultConsent: {
      analytics: false,
      marketing: false,
      preferences: false,
      sale_of_data: false
    },
    retry: { intervalMs: 1000, maxTries: 60 }
  };

  function hasCookiebot() {
    return !!(window.Cookiebot && Cookiebot.consent);
  }

  function safeSetShopifyConsent(consentObj) {
    try {
      if (!window.Shopify || !Shopify.customerPrivacy) return false;
      Shopify.customerPrivacy.setTrackingConsent(consentObj);
      return true;
    } catch (e) { return false; }
  }

  function mapCookiebotToShopify() {
    var C = Cookiebot.consent;
    return {
      analytics: !!C.statistics,
      marketing: !!C.marketing,
      preferences: !!C.preferences,
      sale_of_data: false
    };
  }

  function initShopifyConsentApi() {
    try {
      if (!window.Shopify || typeof Shopify.loadFeatures !== "function") return;
      Shopify.loadFeatures(
        [{ name: "consent-tracking-api", version: "0.1" }],
        function () { safeSetShopifyConsent(CFG.defaultConsent); }
      );
    } catch (e) {}
  }

  function syncFromCookiebot() {
    try {
      if (!hasCookiebot()) return false;
      if (!window.Shopify || !Shopify.customerPrivacy) return false;
      return safeSetShopifyConsent(mapCookiebotToShopify());
    } catch (e) { return false; }
  }

  function attachCookiebotListeners() {
    try {
      window.addEventListener("CookiebotOnConsentReady", syncFromCookiebot);
      window.addEventListener("CookiebotOnAccept", syncFromCookiebot);
      window.addEventListener("CookiebotOnDecline", syncFromCookiebot);
    } catch (e) {}
  }

  function startRetryLoop() {
    var tries = 0;
    var t = setInterval(function () {
      tries += 1;
      var ok = syncFromCookiebot();
      if (ok || tries >= CFG.retry.maxTries) clearInterval(t);
    }, CFG.retry.intervalMs);
  }

  initShopifyConsentApi();
  attachCookiebotListeners();
  startRetryLoop();

  void CONSENT_PROFILE;
})();
</script>

Etape 2 — Render dans theme.liquid

Dans theme.liquid, ajouter apres {{ content_for_header }} :

{% render 'cookie-consent_boostecom' %}

Details techniques

• Utilise Shopify.loadFeatures([{ name: "consent-tracking-api", version: "0.1" }])
• Ecoute CookiebotOnConsentReady, CookiebotOnAccept, CookiebotOnDecline
• Mappe Cookiebot.consent.statistics → analytics, Cookiebot.consent.marketing → marketing
• sale_of_data toujours a false (pas de vente de donnees)
• Retry loop 1000ms, max 60 tentatives pour gerer le chargement async
• Defaults a deny-by-default tant que Cookiebot n'a pas fourni le consentement

5Cookie Declaration Page

Le RGPD exige une page dediee "Politique de cookies" listant les cookies utilises. Cette page est separee de la politique de confidentialite — ce sont deux obligations legales distinctes (traitement des donnees vs stockage de traceurs).

Etape 1 — Creer la page dans Shopify

• Contenu > Pages > Ajouter une page
• Titre : Politique de cookies
• URL handle : /pages/politique-de-cookies

Etape 2 — Coller le contenu (texte + script)

Dans l'editeur Shopify, passer en mode HTML (</>) et coller le contenu suivant. Le texte est conforme CNIL, le script Cookiebot en bas affiche automatiquement la liste des cookies :

<p>La présente politique de cookies explique comment notre site utilise des cookies et autres traceurs lorsque vous le consultez.</p>

<h2>1. Qu'est-ce qu'un cookie ?</h2>
<p>Un cookie est un petit fichier texte déposé et lu lors de la consultation d'un site internet, quel que soit le type de terminal utilisé (ordinateur, smartphone, tablette). Les cookies permettent notamment d'assurer le bon fonctionnement du site, d'améliorer votre expérience utilisateur, de mesurer l'audience et, avec votre consentement, de vous proposer des contenus et publicités personnalisés.</p>

<h2>2. Quels types de cookies utilisons-nous ?</h2>

<h3>Cookies strictement nécessaires</h3>
<p>Ces cookies sont indispensables au bon fonctionnement du site et ne peuvent pas être désactivés. Ils permettent par exemple de mémoriser le contenu de votre panier ou d'assurer la sécurité du site.</p>

<h3>Cookies de mesure d'audience</h3>
<p>Ces cookies nous permettent d'analyser la fréquentation et l'utilisation du site afin d'en améliorer les performances.</p>

<h3>Cookies marketing</h3>
<p>Ces cookies peuvent être utilisés pour vous proposer des publicités adaptées à vos centres d'intérêt sur notre site ou sur des sites tiers.</p>

<h3>Cookies de personnalisation</h3>
<p>Ces cookies permettent d'améliorer et de personnaliser les fonctionnalités du site.</p>

<h2>3. Base légale</h2>
<p>Les cookies strictement nécessaires sont déposés sur la base de notre intérêt légitime à assurer le bon fonctionnement du site. Les autres cookies (mesure d'audience, marketing, personnalisation) sont déposés uniquement après obtention de votre consentement.</p>

<h2>4. Gestion de vos préférences</h2>
<p>Lors de votre première visite sur notre site, un bandeau vous informe de l'utilisation de cookies et vous permet d'accepter, de refuser ou de paramétrer leur utilisation.</p>

<p>Vous pouvez modifier ou retirer votre consentement à tout moment en cliquant sur le lien prévu à cet effet ou en reconfigurant vos préférences via notre outil de gestion des cookies.</p>

<h2>5. Durée de conservation</h2>
<p>Les cookies sont conservés pour une durée maximale de 13 mois conformément aux recommandations de la CNIL.</p>

<h2>6. Cookies déposés sur le site</h2>
<p>La liste détaillée et mise à jour des cookies utilisés sur notre site figure ci-dessous :</p>

<!-- Cookiebot Declaration -->
<script id="CookieDeclaration"
  src="https://consent.cookiebot.com/VOTRE-CBID/cd.js"
  type="text/javascript"
  async></script>

Etape 3 — Ajouter le lien dans le footer

La page doit etre accessible depuis le footer (a cote des autres politiques legales) et depuis le lien dans le banner consent Cookiebot. Sans lien visible = non conforme CNIL.

6Categories de Consent

Categories de consent Google

Mapping Cookiebot → Consent Mode

Consent par destination

7Regions Shopify

Shopify propose une banniere cookies native (Settings > Customer Privacy). Elle doit etre desactivee car le consent est gere par Cookiebot via GTM.

Configuration des regions

Le toggle EEA + UK dans Cookiebot (Add Geo Regions) garantit que la banniere s'affiche uniquement pour les visiteurs europeens et britanniques. Les visiteurs hors de ces zones ne voient pas de banniere (consent implicite).

Comment desactiver

1. 1Admin Shopify → Settings → Customer Privacy
2. 2Section "Banniere concernant les cookies" → decocher toutes les regions, "Utiliser les parametres automatises" OFF
3. 3Section "Page d'opposition au partage de donnees" → decocher toutes les regions, "Utiliser les parametres automatises" OFF
4. 4Sauvegarder

Autres parametres Shopify

• Politique de confidentialite — peut rester "Automatisee". C'est du contenu legal, pas du tracking. Elle n'interfere pas avec Cookiebot.
• Hebergement des donnees — verifier que "Union europeenne" est selectionne (coherent avec CDS Region .eu dans Cookiebot).

Impact de la desactivation

8Consent Mode v2

Le Consent Mode v2 (default denied) est configure dans le tag Cookiebot CMP - Declaration de GTM. Le CBID est renseigne directement dans le champ Cookiebot ID du tag (pas dans une variable separee). Ce tag est deja inclus dans le container BoostEcom importe.

Configuration du tag Cookiebot CMP

Consent Mode Settings

Default Consent State (tous a Denied)

Consent requis par les tags

Chaque tag du container est configure avec les consent types requis. GTM bloque automatiquement le tag tant que le visiteur n'a pas consenti :

9Configuration dans GTM

Tag Cookiebot CMP

• Template officiel Cookiebot depuis la Community Gallery GTM
• Trigger : Consent Initialization — All Pages
• Cookiebot Banner ID (CBID) configure dans le champ Cookiebot ID du tag
• Mode : Auto-blocking activee

Ordre de chargement

1. Consent Initialization (priorite max)
   └── Cookiebot CMP → defaults Denied

2. Consent Update (utilisateur accepte/refuse)
   └── Cookiebot envoie consent_update

3. Tags marketing (attendent ad_storage = Granted)
   └── Meta, Google Ads, etc.

4. Tags analytics (attendent analytics_storage = Granted)
   └── GA4 full tracking

Declenchement

Le trigger Consent Initialization - All Pages s'execute avant tous les autres triggers GTM, garantissant que les defaults Denied sont en place avant tout tracking.

10Verification

Verifier Consent Mode v2

1. 1Ouvrir la console navigateur
2. 2Taper dataLayer et chercher consent_default
3. 3Verifier que tous les signaux sont "denied" par defaut
4. 4Accepter le consent via la banniere Cookiebot
5. 5Verifier consent_update avec les signaux "granted"

Verifier le bridge Shopify

1. 1Ouvrir la console navigateur
2. 2Taper Shopify.customerPrivacy.getTrackingConsent()
3. 3Avant consent : marketing doit etre "no_interaction"
4. 4Apres acceptation : marketing doit etre "yes"
5. 5Apres refus : marketing doit etre "no"

Verifier les tags GTM

• Utiliser GTM Preview Mode
• Avant consent : seul Cookiebot et GA4 Config fires
• Apres consent marketing : Meta, Google Ads fires
• Apres consent analytics : GA4 full tracking fires

Test pre-consent (navigation privee)

1. 1Ouvrir le site en navigation privee
2. 2Cliquer "Tout refuser" dans la banniere Cookiebot
3. 3GTM Preview : verifier que seuls les tags Necessary se declenchent
4. 4Network : aucune requete vers GA4, Meta, Google Ads

Test post-consent

1. 1Ouvrir le site en navigation privee
2. 2Cliquer "Tout accepter" dans la banniere
3. 3GTM Preview : tags analytics et marketing doivent se declencher
4. 4GA4 DebugView : events visibles en temps reel

Phase 2 — Fondations GTM + Consent

• GTM Web container charge via Addingwell (non via snippet direct)
• Tag Cookiebot CMP actif dans GTM avec defaults a Denied
• Cookiebot CMP se declenche sur Consent Initialization (avant les autres tags)
• Option "Tout refuser" disponible dans la banniere
• Bridge Cookiebot → Shopify Privacy API installe (cookie-consent_boostecom.liquid) — obligatoire
• DataLayer Monitor custom pixel actif dans Customer Events (?awdebug=1 pour debug)
• Regions Shopify : banniere native OFF, custom banner regions EEA + UK

11Troubleshooting

12Checklist Consent

Verifier apres chaque mise en production :