# Installer FlowConsent sur HubSpot

Sur un site HubSpot, collez l'extrait FlowConsent dans Settings → Content → Pages → Site header HTML, puis désactivez la bannière de cookies native de HubSpot.

> Canonical: https://www.flowconsent.com/fr/doc/install-hubspot
> Last updated: 2026-10-01
Sur un site hébergé par HubSpot (Content Hub, anciennement CMS Hub), l'extrait de code FlowConsent se colle en haut du champ **Site header HTML**, dans **Settings → Content → Pages**, ce qui l'ajoute au `<head>` de toutes les pages du domaine. L'installation tient en trois étapes : copier l'extrait, le coller dans Site header HTML, puis désactiver la bannière de cookies native de HubSpot. Ce dernier point est le piège principal : sans lui, vos visiteurs voient deux bannières.

## Avant de commencer

- Un compte sur [app.flowconsent.com](https://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](/fr/doc/cloudflare-deployment)), en un clic sur Pro et Enterprise.
- Dans HubSpot, la permission **Website settings**, et un abonnement qui autorise le code personnalisé dans l'en-tête. HubSpot l'indique pour Content Hub Starter, Professional et Enterprise, ainsi que Marketing Hub Professional et Enterprise.

## Étape 1 : copier l'extrait de code

Dans FlowConsent, ouvrez **Builder → Déploiement → Intégration**, onglet **HTML / No-code**. L'extrait comporte deux parties : le stub Google Consent Mode v2 (valeurs `denied` par défaut), puis le script de la bannière.

## Étape 2 : coller l'extrait dans Site header HTML

1. Dans HubSpot, cliquez sur l'icône des **paramètres** (engrenage) dans la barre de navigation du haut.
2. Dans le menu de gauche, ouvrez **Content → Pages**.
3. Dans le menu déroulant **Choose a domain to edit its settings**, gardez les réglages par défaut pour couvrir tous vos domaines, ou choisissez un domaine précis puis cliquez sur **Override default settings** dans la section **Site header HTML**.
4. Collez l'extrait **tout en haut** du champ **Site header HTML**, avant tout code existant, en ajoutant la ligne qui désactive la bannière HubSpot (voir l'étape 3) :

```html title="Settings → Content → Pages → Site header HTML"
<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>
<!-- Désactive la bannière de cookies native de HubSpot -->
<script>window.disableHubSpotCookieBanner = true;</script>
```

5. Cliquez sur **Save** en bas à gauche.

Tout script de suivi déjà présent dans ce champ (Google Analytics, Meta Pixel, Google Tag Manager…) doit rester **sous** l'extrait : ce qui est placé au-dessus échappe au blocage préalable.

## Étape 3 : désactiver la bannière native de HubSpot

> [!WARNING]
> HubSpot affiche sa propre bannière de consentement sur les pages qu'il héberge dès qu'une bannière est configurée dans **Settings → Privacy & Consent → Cookies**. Avec FlowConsent en plus, le visiteur voit deux bannières, et deux choix potentiellement contradictoires. La documentation développeur de HubSpot prévoit l'indicateur `window.disableHubSpotCookieBanner = true;`, à définir dans le `<head>` avant le chargement de la bannière HubSpot : c'est la ligne ajoutée à la fin de l'extrait ci-dessus.

Selon HubSpot, cet indicateur désactive aussi la gestion du consentement de HubSpot. Le code de suivi HubSpot, ajouté automatiquement par HubSpot sur ses pages, dépose ses propres cookies (`__hstc`, `hubspotutk`…) : pour qu'ils suivent le choix du visiteur, HubSpot met à disposition la fonction `setHubSpotConsent` de son API Cookie Banner, à brancher par un développeur. Le scan de refus (voir plus bas) vous montre si ces cookies sont déposés sans consentement.

## Le piège des intégrations natives

> [!NOTE]
> Dans **Settings → Content → Pages**, l'onglet **Integrations** propose les cases **Integrate with Google Analytics 4** et **Integrate with Google Tag Manager**. Ces intégrations injectent leurs scripts hors de votre contrôle et, d'après HubSpot, le script GA ne s'appuie que sur la bannière HubSpot. Décochez-les : déclarez Google Analytics dans **Builder → Services**, pour que FlowConsent ne le charge qu'après consentement, et collez le conteneur GTM à la main dans **Site header HTML**, sous l'extrait FlowConsent.

Ne chargez jamais FlowConsent depuis GTM : une bannière chargée par GTM arrive trop tard pour le blocage préalable. Les balises GTM respectent ensuite les signaux Consent Mode v2 ; les balises non Google demandent les « Paramètres supplémentaires de consentement » ([guide Consent Mode](/fr/doc/google-consent-mode)).

## Vérifier l'installation

1. Ouvrez une page publiée en navigation privée : seule la bannière FlowConsent s'affiche.
2. Dans l'onglet **Réseau**, aucune requête tierce avant **Accepter**.
3. Lancez l'**assistant d'installation** (**Builder → Intégration**) : loader présent avec votre code de licence, stub Consent Mode présent, stub placé avant chaque tag Google ([guide](/fr/doc/setup-wizard)).
4. Terminez par un **scan de refus** depuis l'onglet **Conformité** ([vérification de conformité](/fr/doc/compliance-verification)).

## 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, via une connexion OAuth 2.0 à 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`). Il ne modifie pas vos réglages HubSpot : le collage reste de votre côté.

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

Voir le [guide du serveur MCP](/fr/doc/mcp-server) et la page [FlowConsent MCP](/fr/mcp).

## Questions fréquentes

### L'extrait s'applique-t-il aussi aux landing pages et au blog HubSpot ?

Le champ Site header HTML s'applique au contenu hébergé par HubSpot sur le domaine choisi. Vérifiez une landing page et un article de blog avec l'assistant d'installation après l'enregistrement.

### Mon site n'est pas hébergé par HubSpot, seul le code de suivi y est installé. Que faire ?

Cette page ne s'applique pas : installez FlowConsent sur la plateforme qui héberge le site, puis déclarez HubSpot dans **Builder → Services**.

### Puis-je garder la bannière HubSpot et FlowConsent ensemble ?

Ce n'est pas recommandé : deux bannières gênent le visiteur et peuvent enregistrer des choix différents. Gardez une seule bannière, FlowConsent, avec l'indicateur `disableHubSpotCookieBanner`.

### Je n'ai pas accès au champ Site header HTML, pourquoi ?

Il faut la permission **Website settings** et un abonnement HubSpot qui autorise le code dans l'en-tête. Demandez à un super administrateur de votre compte HubSpot.