Aller au contenu principal

Installation manuelle

Durée : ~5 minutes Prérequis : Accès au code source HTML de votre site web

Étape 1 : Copier votre extrait d'intégration​

Dans votre tableau de bord ConsentForge, allez dans Propriété → Intégrer et copiez votre extrait :

<script
  src="https://cdn.consentforge.com/consentforge.min.js"
  data-token="VOTRE_TOKEN_INTEGRATION"
  data-position="bottom"
  data-theme="auto"
  defer
></script>

Étape 2 : L'ajouter à votre HTML​

Collez l'extrait avant </head> — pas en bas de <body>.

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Mon site</title>
  <!-- ConsentForge — doit être avant tout script tiers -->
  <script
    src="https://cdn.consentforge.com/consentforge.min.js"
    data-token="cf_live_abc123"
    defer
  ></script>
</head>
<body>
  ...
</body>
</html>
L'ordre est important

Le script ConsentForge doit se charger avant tout script tiers (Google Analytics, Meta Pixel, etc.) pour que le blocage de scripts fonctionne correctement.

Étape 3 : Marquer les scripts tiers pour le blocage​

Ajoutez type="text/plain" et data-consent-category à tout script que vous souhaitez bloquer jusqu'à ce que le consentement soit donné :

<!-- AVANT : se charge immédiatement, ignore le consentement -->
<script src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXX"></script>

<!-- APRÈS : bloqué jusqu'à ce que l'utilisateur consente à "analytics" -->
<script
  type="text/plain"
  data-consent-category="analytics"
  src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXX"
></script>

Valeurs de catégorie :

ValeurSignification
necessarySe charge toujours (pas de blocage)
analyticsSe charge après consentement analytique
marketingSe charge après consentement marketing
functionalSe charge après consentement fonctionnel

Étape 4 : Tester​

Ouvrez votre site dans une fenêtre incognito. La bannière de consentement devrait apparaître avant que les scripts bloqués se chargent. Vérifiez dans DevTools → Réseau que les scripts bloqués n'apparaissent pas avant le consentement.

Exemples courants​

Google Analytics 4​

<script type="text/plain" data-consent-category="analytics"
  src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXX"></script>
<script type="text/plain" data-consent-category="analytics">
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXX');
</script>

Meta Pixel​

<script type="text/plain" data-consent-category="marketing">
  !function(f,b,e,v,n,t,s)
  {if(f.fbq)return;n=f.fbq=function(){...}
  fbq('init', 'VOTRE_PIXEL_ID');
  fbq('track', 'PageView');
</script>

Intégration YouTube​

<!-- Utiliser data-src au lieu de src -->
<iframe
  data-src="https://www.youtube.com/embed/VIDEO_ID"
  data-consent-category="marketing"
  width="560" height="315"
  frameborder="0">
</iframe>