Cookiequiet

FonctionnalitésTarifsOutils gratuitsLoisPlateformesComparatifsGuidesBlogFAQGlossaire
ENCommencer gratuitementSe connecter
Plateformes

Comment ajouter un bandeau cookies à un site Framer

Dans Framer, ouvrez les Site Settings (appelés Project Settings dans les anciennes docs), allez dans la section de code personnalisé, ajoutez un script avec l’emplacement « Start of head tag », collez la balise, enregistrez et publiez. La mesure d’audience intégrée de Framer ne dépose aucun cookie : les balises à marquer sont celles que vous ajoutez vous-même, Google, Meta, widgets de chat et contenus embarqués.
Publié le 20 octobre 2026 · Par l’équipe Cookiequiet

Étapes

Ouvrir les réglages de code personnaliséOuvrez les Site Settings de votre site et allez dans la section de code personnalisé (l’onglet Code ; les anciennes docs Framer l’appellent l’onglet Custom Code des Project Settings).
Ajouter la balise au début du headCliquez sur Add Script (ou sur l’icône +), collez la balise Cookiequiet, réglez Placement sur Start of head tag, Pages sur All et Run sur Once, puis enregistrez.
Ajouter vos balises en dessousAjoutez la balise Google ou le pixel Meta comme seconde entrée, marquée avec type="text/plain" et data-cq-category, ou précédée du bloc de consentement par défaut de Google. Si les deux entrées partagent l’emplacement Start of head, vérifiez dans le code source de la page publiée que la balise Cookiequiet vient en premier ; sinon, placez la balise en Start of body.
Marquer les contenus embarqués et les widgetsDans les composants Embed, écrivez les iframes avec data-cq-src au lieu de src, et donnez aux scripts de chat ou de mesure d’audience le même marquage avec la bonne catégorie.
Ajouter le lien Préférences de cookiesAjoutez un lien texte dans le pied de page avec l’URL #cq-preferences. Si Framer le transforme en ancre de page, utilisez un composant Embed contenant un lien HTML avec data-cq-show-preferences, ou activez le bouton flottant de préférences.
Publier et testerPubliez, ouvrez le site dans une fenêtre de navigation privée, cliquez sur Tout refuser et vérifiez qu’aucun cookie _ga ou _fbp n’est déposé. Acceptez tout, rechargez et confirmez que les balises se chargent. Le code personnalisé ne s’exécute pas dans l’aperçu.

Où coller la balise dans Framer

Framer ajoute le code commun à tout le site depuis les réglages du site, avec un choix d’emplacement pour chaque entrée.

  1. Ouvrez les « Site Settings » (les anciens articles Framer parlent de Project Settings) et allez dans la section de code personnalisé : elle apparaît comme l’onglet « Code » dans les guides actuels de Framer et comme l’onglet « Custom Code » dans les anciens.
  2. Cliquez sur « Add Script » (ou sur l’icône « + »), collez la balise, puis réglez « Placement » sur « Start of head tag » (début du head), « Pages » sur « All » (toutes) et « Run » sur « Once » (une fois).
  3. Enregistrez, puis « Publish » : le code personnalisé ne s’exécute que sur le site publié.
html
<script src="https://cookiequiet.com/cq.js" data-site="YOUR_SITE_KEY" data-consent-mode="1" data-auto-block="1" defer></script>

« Start of head » est l’emplacement le plus précoce que propose Framer, et c’est ce qu’il faut à un script de consentement : il doit s’exécuter avant toute balise qui dépose des cookies.

Comment gérer la mesure d’audience de Framer et les balises que vous ajoutez

Framer Analytics. La mesure d’audience intégrée de Framer n’utilise ni cookies ni identifiants persistants : elle hache l’adresse IP et le user agent avec un secret qui change chaque jour, et Framer indique qu’aucun consentement aux cookies n’est nécessaire pour l’utiliser. Rien à marquer de ce côté.

Balises que vous ajoutez. Tout le reste passe par le même panneau de code personnalisé, c’est donc vous qui décidez comment cela se charge :

  • Marquage (rien ne se charge avant le consentement) : ajoutez la balise Google ou le pixel Meta comme seconde entrée avec type="text/plain" et data-cq-category="analytics" ou "marketing" sur chaque balise script. Cookiequiet les exécute une fois la catégorie accordée.
  • Consent Mode (la balise Google se charge avec des signaux refusés par défaut et envoie des pings sans cookies jusqu’au consentement) : placez le bloc de consentement par défaut de Google dans la même entrée que la balise Google, au-dessus d’elle, pour que le défaut soit toujours en place, comme montré dans le guide Google Analytics 4.

Quand plusieurs entrées utilisent l’emplacement « Start of head », ouvrez le code source de la page publiée et vérifiez que la balise Cookiequiet est imprimée en premier. Si ce n’est pas le cas, donnez à l’entrée de la balise l’emplacement « Start of body » (début du body) ; une balise marquée fonctionne depuis n’importe où, et le bloc de consentement par défaut doit simplement précéder la balise Google.

Contenus embarqués. Dans un composant « Embed » avec du HTML, écrivez l’iframe avec data-cq-src au lieu de src : Cookiequiet renseigne l’adresse après le consentement. Les composants vidéo et carte natifs de Framer construisent leurs propres iframes en JavaScript ; le bloqueur automatique retient ceux qu’il connaît (YouTube sous marketing, Vimeo sous fonctionnel) jusqu’à ce que la catégorie soit accordée, ce que le test ci-dessous confirmera pour votre site.

Widgets de chat. Marquez leur script de chargement avec data-cq-category="functional" (ou marketing quand l’éditeur s’en sert aussi pour la publicité).

Comment ajouter le lien Préférences de cookies

Ajoutez un lien texte libellé « Préférences de cookies » dans le pied de page et réglez son URL sur #cq-preferences. Framer traite les liens avec un dièse comme des ancres de page ; si le lien publié ne porte plus exactement ce href, utilisez un composant « Embed » contenant <a href="#cq-preferences" data-cq-show-preferences>Cookie preferences</a> dans le pied de page, ou activez le bouton flottant de préférences dans les réglages du bandeau.

Comment tester

  1. Publiez, puis ouvrez le site publié dans une fenêtre de navigation privée et cliquez sur « Tout refuser ».
  2. Vérifiez les cookies dans les outils de développement : cq_consent et rien de Google ni de Meta.
  3. Effacez les cookies, cliquez sur « Tout accepter », rechargez : les balises marquées s’exécutent et leurs cookies apparaissent.
  4. Ouvrez le registre des consentements dans le tableau de bord Cookiequiet.

Le bandeau ne s’affiche pas dans l’aperçu de Framer ; il lui faut le site publié.

Ce qui est propre à Framer

  • Site publié uniquement. Le code personnalisé et le bandeau n’existent que sur le site publié, y compris une publication de préproduction si vous en utilisez une.
  • Pas de bandeau intégré. Framer n’a pas de bandeau de consentement ; les composants de la marketplace qui en ajoutent un doivent être retirés avant de publier avec Cookiequiet.
  • Localisation. Le code s’applique à toutes les langues ; la langue du bandeau suit le navigateur du visiteur, et chaque texte est modifiable par langue.
  • Content Security Policy. Si vous en définissez une via les en-têtes personnalisés de Framer, autorisez https://cookiequiet.com dans script-src et connect-src.

Si vous ne savez pas ce que votre site charge, le scanner de cookies gratuit le liste à partir des pages publiées.

Questions

Framer indique que sa mesure d’audience ne dépose aucun cookie, ne conserve aucun identifiant persistant et ne nécessite aucun consentement. Le bandeau sert pour les scripts tiers que vous ajoutez : Google, Meta, widgets de chat, vidéos embarquées.
Framer n’exécute le code personnalisé que sur le site publié. Publiez, puis testez dans une fenêtre de navigation privée.
Dans les Site Settings, dans la section de code : les guides actuels de Framer la montrent comme l’onglet Code, les anciens comme l’onglet Custom Code des Project Settings. L’option d’emplacement Start of head tag est la même dans les deux.
Soit marquez ses deux balises script avec type="text/plain" et data-cq-category="analytics" dans l’entrée de code personnalisé, soit placez le bloc de consentement par défaut de Google au-dessus de la balise Google dans la même entrée, pour qu’elle tourne en Consent Mode avec analytics_storage refusé jusqu’à ce que le visiteur accepte.

Sources

Sur le même sujet

Cookie banner for Webflow: install Cookiequiet in the Head codePaste the Cookiequiet snippet in Webflow's Head code, mark your tags, pass consent to Webflow Analyze, add a Cookie preferences link and test Reject all.Google Analytics 4 and Cookiequiet: Consent Mode v2 or no tag before consentRun Google Analytics 4 with Cookiequiet: Consent Mode with analytics_storage denied until consent, or the Google tag marked so it never loads before consent.Meta Pixel and Cookiequiet: fire the pixel only after marketing consentHold the Meta Pixel until marketing consent with Cookiequiet: mark the base code, fire it from Google Tag Manager on cq_consent, or use Meta's consent calls.
Retour à la rubrique Plateformes

Mettez un bandeau discret sur votre site dès aujourd’hui

Gratuit pour un site avec toutes les fonctions essentielles, sans carte ni période d’essai qui expire. Passez un site en Starter pour €3 par mois pour le mettre à vos couleurs par IA sans la mention Cookiequiet, ou en Pro pour €9 pour le concevoir avec l’agent IA.
Commencer gratuitement, sans carteVoir les tarifs