Blog

Comment installer une banniere de consentement cookies sur WordPress, Shopify ou un site fait main

Publie le 13/09/2026 · Temps de lecture : 8 min

Une fois votre banniere de consentement configuree (message, couleurs, boutons d'acceptation et de refus), il reste une seule etape technique avant qu'elle ne s'affiche reellement sur votre site : coller un extrait de code a l'endroit approprie. Cette etape est souvent perçue comme un obstacle technique, alors qu'elle prend en general moins de 5 minutes, quelle que soit la plateforme utilisee.

Sommaire

• Installer sur WordPress
• Installer sur Shopify
• Installer sur Wix ou Squarespace
• Installer sur un site fait main (HTML, Next.js, autre framework)
• Le cas particulier de Google Tag Manager
• Comment verifier que tout fonctionne
• Erreurs frequentes lors de l'installation
• Questions frequentes

Installer sur WordPress

WordPress propose plusieurs methodes selon votre niveau de confort technique.

Methode recommandee (sans toucher au code du theme) :

1. Installez une extension gratuite comme « Insert Headers and Footers » ou « WPCode » depuis Extensions > Ajouter.
2. Ouvrez les reglages de l'extension, generalement accessibles depuis Reglages ou Apparence selon l'extension choisie.
3. Collez le code d'integration fourni par ConformiteFacile dans le champ Footer (pied de page), qui s'applique automatiquement a toutes les pages du site.
4. Enregistrez.

Methode alternative (edition directe du theme) : dans Apparence > Editeur de fichiers de theme, ouvrez footer.php et collez le code juste avant la balise </body>. Cette methode presente un risque : le code sera perdu si vous changez de theme ou lors d'une mise a jour majeure du theme, contrairement a une extension dediee qui persiste independamment du theme actif.

Installer sur Shopify

1. Dans l'administration Shopify, allez dans Boutique en ligne > Themes.
2. Cliquez sur les trois points a cote de votre theme actif, puis Modifier le code.
3. Dans la liste des fichiers, ouvrez layout/theme.liquid (le fichier de mise en page principal, applique a toutes les pages de la boutique).
4. Collez le code d'integration juste avant la balise </body>, tout en bas du fichier.
5. Cliquez sur Enregistrer.

Point d'attention specifique a Shopify : la plateforme depose elle-meme certains cookies techniques et, selon les applications installees depuis l'App Store (avis clients, upsell, retargeting), des cookies tiers supplementaires. Verifiez la liste de vos applications installees et assurez-vous que celles liees au marketing ou a la mesure d'audience respectent egalement le choix du visiteur.

Installer sur Wix ou Squarespace

Ces plateformes tout-en-un limitent generalement l'acces au code source complet, mais proposent un emplacement dedie pour des scripts personnalises :

• Wix : dans le tableau de bord, allez dans Parametres > Suivi et analyses > Nouvel outil (ou « Code personnalise » selon la version), puis choisissez de charger le code sur toutes les pages, dans la section Body - fin.
• Squarespace : dans Parametres > Avance > Injection de code, collez le code dans le champ Pied de page (Footer), disponible selon la formule d'abonnement (fonctionnalite parfois reservee aux plans payants).

Installer sur un site fait main (HTML, Next.js, autre framework)

Pour un site en HTML statique, collez la balise <script> fournie avant la fermeture de </body> de chaque page, ou dans un fichier inclus (footer commun) si votre site utilise un systeme de templates.

Pour un site construit avec un framework JavaScript (Next.js, Nuxt, SvelteKit...), ajoutez le script dans le layout racine de l'application afin qu'il se charge sur l'ensemble des pages sans avoir a le dupliquer. Avec Next.js par exemple, cela signifie l'ajouter dans le fichier app/layout.tsx, idealement avec le composant next/script et une strategie de chargement afterInteractive pour ne pas bloquer le rendu initial de la page.

Le cas particulier de Google Tag Manager

Beaucoup de sites ne chargent pas leurs outils de mesure directement, mais passent par Google Tag Manager (GTM), qui sert de chef d'orchestre : un seul script installe sur le site, puis des balises ajoutees depuis une interface. C'est pratique, mais cela cree un piege frequent en matiere de conformite.

Installer une banniere sur un site equipe de GTM ne suffit pas : si les balises configurees dans GTM se declenchent des le chargement de la page, les cookies partent malgre la banniere. Le conteneur GTM lui-meme ne depose pas de cookie de mesure, mais les balises qu'il declenche, si. Autrement dit, la banniere peut afficher un message parfaitement conforme pendant que Google Analytics travaille deja en arriere-plan.

Deux approches permettent de corriger cela. La premiere consiste a conditionner le declenchement de chaque balise a un evenement envoye par la banniere apres acceptation : les balises ne sont plus configurees sur « Toutes les pages » mais sur cet evenement de consentement. La seconde s'appuie sur le mode Consentement de Google (Consent Mode), ou les balises restent declenchees mais adaptent leur comportement selon l'etat du consentement transmis.

Dans les deux cas, la verification decrite ci-dessous reste la seule preuve fiable : peu importe la configuration theorique, ce qui compte est ce qui se depose reellement dans le navigateur avant le clic du visiteur.

Comment verifier que tout fonctionne

Une fois le code en place, effectuez ce controle en 4 etapes :

1. Ouvrez votre site dans une fenetre de navigation privee (pour partir sans cookies existants).
2. La banniere doit apparaitre immediatement, avant toute interaction.
3. Ouvrez les outils de developpeur (touche F12 ou clic droit > Inspecter), onglet Application sur Chrome/Edge ou Stockage sur Firefox, et verifiez la liste des cookies presents. A ce stade, seuls des cookies techniques (session, panier) doivent apparaitre.
4. Cliquez sur Tout accepter, rechargez la page, et verifiez que les cookies tiers (Google Analytics, Facebook...) apparaissent desormais. Refaites le test avec Tout refuser : ces memes cookies ne doivent jamais apparaitre.

Erreurs frequentes lors de l'installation

• Coller le code dans le <head> plutot que juste avant </body> : la banniere peut alors s'afficher avant que le reste de la page ne soit charge, ce qui degrade l'experience visuelle sans empecher son fonctionnement.
• Installer le code sur une seule page plutot que dans un gabarit commun (footer, layout) : la banniere n'apparait alors que sur la page d'accueil, pas sur les pages internes.
• Garder une ancienne banniere active en parallele : deux bannières de consentement qui se chevauchent creent une experience confuse et peuvent generer des conflits de cookies.
• Oublier de purger le cache d'un plugin de cache WordPress (WP Rocket, W3 Total Cache) apres modification : l'ancienne version de la page, sans la banniere, continue d'etre servie aux visiteurs.

Questions frequentes

A lire aussi

Guide technique

Checklist RGPD : les 10 points a verifier avant de lancer un site internet

Lire

Parrainage & prospection

Parrainage client et RGPD : comment collecter les donnees d'un filleul sans risquer une sanction

Lire

Teletravail & securite

Teletravail et RGPD : comment securiser les donnees quand vos salaries travaillent a distance

Lire