Installer FlowConsent sur WooCommerce

Une boutique WooCommerce est un site WordPress : l'extrait de code FlowConsent se colle au même endroit, en haut du champ Header de l'extension WPCode (Code Snippets → Header & Footer) ou dans un thème enfant. Comptez quatre étapes : coller l'extrait, reprendre la main sur les pixels injectés par les extensions marketing de la boutique, régler le cache, puis tester le tunnel de commande. Le piège principal : Google Analytics for WooCommerce, Meta for WooCommerce et les autres extensions de suivi ajoutent leurs propres scripts, souvent au-dessus de la bannière.

Avant de commencer

• Un compte sur app.flowconsent.com (offre Free gratuite, sans carte bancaire, jusqu'à 25 000 sessions par mois).
• Une bannière créée puis déployée : via votre compte Cloudflare sur l'offre Free (guide Cloudflare), en un clic sur Pro et Enterprise.
• Un accès administrateur à WordPress, et idéalement une copie de préproduction de la boutique pour tester le paiement.

Étape 1 : coller l'extrait de code dans le head

Copiez l'extrait depuis Builder → Déploiement → Intégration, onglet HTML / No-code :

<script>
// FlowConsent Loader - PLACER AVANT tout autre script dans le <head>
window.dataLayer=window.dataLayer||[];
function gtag(){dataLayer.push(arguments);}
gtag('consent','default',{
  'ad_storage':'denied',
  'analytics_storage':'denied',
  'ad_user_data':'denied',
  'ad_personalization':'denied',
  'wait_for_update':500
});
gtag('set','url_passthrough',true);
gtag('set','ads_data_redaction',true);
</script>
<!-- FlowConsent CMP -->
<script src="https://VOTRE-CODE-LICENCE.consent.flowconsent.com/cookie-manager.js?code=VOTRE_CODE_LICENCE"></script>

Installez l'extension WPCode depuis le menu Extensions, ouvrez Code Snippets → Header & Footer et collez l'extrait tout en haut du champ Header, au-dessus de tout autre code, puis enregistrez. Alternative sans extension : un thème enfant qui accroche l'extrait au hook wp_head avec la priorité 1. Les deux méthodes sont détaillées dans le guide WordPress.

L'extrait doit précéder tout script de suivi (Google Analytics, Meta Pixel, Google Tag Manager…) : tout ce qui est placé au-dessus échappe au blocage préalable.

Étape 2 : reprendre la main sur les extensions marketing

C'est l'étape qui distingue une boutique d'un site vitrine. Chaque extension de suivi injecte son script à sa manière.

Google Analytics for WooCommerce (réglages dans WooCommerce → Settings → Integration → Google Analytics) charge gtag et définit ses propres valeurs par défaut de Consent Mode, qui peuvent prendre le pas sur celles de FlowConsent. Deux options :

• garder l'extension pour ses événements e-commerce, vérifier avec l'assistant d'installation que son gtag arrive bien sous le stub FlowConsent, et, en cas de conflit de valeurs par défaut, les ajuster avec le filtre woocommerce_ga_gtag_consent_modes documenté par WooCommerce ;
• ou retirer l'identifiant de mesure de l'extension et déclarer Google Analytics dans Builder → Services, pour que la bannière ne le charge qu'après consentement.

Meta for WooCommerce (anciennement Facebook for WooCommerce, réglages dans Marketing → Facebook) injecte le Meta Pixel automatiquement. Pour que le pixel ne soit chargé que par la bannière, désactivez celui de l'extension avec le filtre officiel facebook_for_woocommerce_integration_pixel_enabled (dans le functions.php du thème enfant ou un snippet PHP WPCode), puis déclarez Meta Pixel dans Builder → Services.

add_filter( 'facebook_for_woocommerce_integration_pixel_enabled', '__return_false' );

Même logique pour les autres pixels publicitaires (Google Ads, TikTok, Pinterest…) : retirez l'identifiant des réglages de l'extension et déclarez le service dans Builder → Services.

Étape 3 : cache et minification

WooCommerce demande d'exclure du cache les pages Panier, Commande et Mon compte, et déconseille la minification JavaScript avec certaines extensions de cache. Pour la bannière, excluez aussi des options « différer » ou « retarder le JavaScript » le stub Consent Mode (FlowConsent Loader) et le domaine consent.flowconsent.com. Videz ensuite tous les caches (extension, hébergeur, CDN).

Étape 4 : tester le tunnel de paiement

Vérifier l'installation

1. En navigation privée, la bannière s'affiche sur l'accueil, une fiche produit et le panier.
2. Dans l'onglet Réseau, aucune requête vers Google, Meta ou un autre tiers avant Accepter.
3. L'assistant d'installation (Builder → Intégration) contrôle la page en ligne : loader présent avec votre code de licence, stub Consent Mode présent, stub placé avant chaque tag Google (guide).
4. Un scan de refus depuis l'onglet Conformité confirme que rien ne part après un refus (vérification de conformité).

Le faire depuis votre agent IA (MCP)

Le serveur MCP officiel de FlowConsent, https://mcp.flowconsent.com, fonctionne avec Claude, ChatGPT ou tout client MCP, avec une connexion OAuth 2.0 sur votre compte FlowConsent (pas de clé d'API). Votre agent récupère l'extrait et les instructions de placement (get_banner_snippet, get_setup_instructions), vérifie l'installation par un vrai scan (verify_consent_compliance) et peut poser une surveillance récurrente (monitor_compliance), utile pour repérer un pixel réactivé par une mise à jour d'extension. Il ne modifie pas votre boutique : le collage et les réglages d'extensions restent de votre côté.

Exemple de demande : « Donne-moi l'extrait de code de ma bannière pour ma boutique WooCommerce et vérifie qu'il est bien installé sur https://maboutique.fr ».

Voir le guide du serveur MCP et la page FlowConsent MCP.

Questions fréquentes

Est-ce que je perds mes données e-commerce en refusant les cookies ?

Les visiteurs qui refusent ne déposent pas de cookies de mesure. Avec Consent Mode v2, les balises Google envoient alors des signaux sans cookies, que Google utilise pour sa modélisation des conversions. Détails dans le guide Consent Mode.

Puis-je charger FlowConsent via Google Tag Manager ?

Non : chargée depuis GTM, la bannière arrive trop tard pour le blocage préalable. Placez l'extrait dans le <head> au-dessus du conteneur GTM ; les balises non Google demandent les « Paramètres supplémentaires de consentement ».

Une mise à jour d'extension peut-elle réactiver un pixel ?

Oui, c'est fréquent après un changement de version ou une reconfiguration. Une surveillance récurrente depuis l'onglet Conformité, ou via monitor_compliance en MCP, le détecte sans attendre un audit manuel.

Faut-il une configuration différente pour une boutique headless ?

Oui. Si la vitrine est une application React, Vue ou Next.js qui navigue côté client, activez le mode SPA dans les réglages de la bannière (guide Next.js).