# Instalar FlowConsent en HubSpot

En HubSpot, el fragmento de FlowConsent va en Settings → Content → Pages → Site header HTML; después se desactiva el banner de cookies nativo de HubSpot.

> Canonical: https://www.flowconsent.com/es/doc/install-hubspot
> Last updated: 2026-10-01
En un sitio alojado en HubSpot (Content Hub, antes CMS Hub), el fragmento de código de FlowConsent se pega al principio del campo **Site header HTML**, en **Settings → Content → Pages**, lo que lo añade al `<head>` de todas las páginas del dominio. La instalación son tres pasos: copiar el fragmento, pegarlo en Site header HTML y desactivar el banner de cookies nativo de HubSpot. Este último punto es la trampa principal: sin él, los visitantes ven dos banners.

## Antes de empezar

- Una cuenta en [app.flowconsent.com](https://app.flowconsent.com) (plan Free gratuito, sin tarjeta de crédito, hasta 25.000 sesiones al mes).
- Un banner creado y desplegado: a través de la propia cuenta de Cloudflare en el plan Free ([guía de Cloudflare](/es/doc/cloudflare-deployment)), con un clic en Pro y Enterprise.
- En HubSpot, el permiso **Website settings** y una suscripción que permita código personalizado en la cabecera. HubSpot lo indica para Content Hub Starter, Professional y Enterprise, así como para Marketing Hub Professional y Enterprise.

## Paso 1: copiar el fragmento de código

En FlowConsent, abrir **Builder → Despliegue → Integración**, pestaña **HTML / No-code**. El fragmento tiene dos partes: el stub de Google Consent Mode v2 (valores `denied` por defecto) y el script del banner.

## Paso 2: pegar el fragmento en Site header HTML

1. En HubSpot, hacer clic en el icono de **configuración** (engranaje) de la barra de navegación superior.
2. En el menú lateral izquierdo, abrir **Content → Pages**.
3. En el desplegable **Choose a domain to edit its settings**, mantener la configuración por defecto para cubrir todos los dominios, o elegir un dominio concreto y hacer clic en **Override default settings** en la sección **Site header HTML**.
4. Pegar el fragmento **al principio** del campo **Site header HTML**, antes de cualquier código existente, junto con la línea que desactiva el banner de HubSpot (ver el paso 3):

```html title="Settings → Content → Pages → Site header HTML"
<script>
// FlowConsent Loader - COLOCAR ANTES de cualquier otro script en el <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://SU-CODIGO-LICENCIA.consent.flowconsent.com/cookie-manager.js?code=SU_CODIGO_LICENCIA"></script>
<!-- Desactiva el banner de cookies nativo de HubSpot -->
<script>window.disableHubSpotCookieBanner = true;</script>
```

5. Hacer clic en **Save**, abajo a la izquierda.

Cualquier script de seguimiento que ya esté en ese campo (Google Analytics, Meta Pixel, Google Tag Manager…) debe quedar **debajo** del fragmento: todo lo que quede por encima escapa al bloqueo previo.

## Paso 3: desactivar el banner nativo de HubSpot

> [!WARNING]
> HubSpot muestra su propio banner de consentimiento en las páginas que aloja en cuanto hay un banner configurado en **Settings → Privacy & Consent → Cookies**. Con FlowConsent además, el visitante ve dos banners y puede tomar dos decisiones contradictorias. La documentación para desarrolladores de HubSpot prevé el indicador `window.disableHubSpotCookieBanner = true;`, que debe definirse en el `<head>` antes de que cargue el banner de HubSpot: es la línea añadida al final del fragmento anterior.

Según HubSpot, este indicador también desactiva la gestión del consentimiento de HubSpot. El código de seguimiento de HubSpot, que HubSpot añade automáticamente a sus páginas, coloca sus propias cookies (`__hstc`, `hubspotutk`…): para que respeten la elección del visitante, HubSpot ofrece la función `setHubSpotConsent` de su Cookie Banner API, que un desarrollador debe conectar. El escaneo de rechazo (ver más abajo) muestra si esas cookies se colocan sin consentimiento.

## La trampa de las integraciones nativas

> [!NOTE]
> En **Settings → Content → Pages**, la pestaña **Integrations** ofrece las casillas **Integrate with Google Analytics 4** e **Integrate with Google Tag Manager**. Estas integraciones inyectan sus scripts fuera de cualquier control y, según HubSpot, el script de GA solo atiende al banner de HubSpot. Conviene desmarcarlas: declarar Google Analytics en **Builder → Servicios**, para que FlowConsent solo lo cargue tras el consentimiento, y pegar el contenedor de GTM a mano en **Site header HTML**, debajo del fragmento de FlowConsent.

FlowConsent nunca debe cargarse desde GTM: un banner cargado por GTM llega demasiado tarde para el bloqueo previo. Las etiquetas de GTM respetan después las señales de Consent Mode v2; las que no son de Google requieren la «Configuración de consentimiento adicional» ([guía de Consent Mode](/es/doc/google-consent-mode)).

## Verificar la instalación

1. Abrir una página publicada en una ventana privada: solo aparece el banner de FlowConsent.
2. En la pestaña **Red**, ninguna petición a terceros antes de **Aceptar**.
3. Ejecutar el **asistente de instalación** (**Builder → Integración**): loader presente con el código de licencia correcto, stub de Consent Mode presente, stub antes de cada etiqueta de Google ([guía](/es/doc/setup-wizard)).
4. Terminar con un **escaneo de rechazo** desde la pestaña **Conformidad** ([verificación de conformidad](/es/doc/compliance-verification)).

## Hacerlo desde un agente de IA (MCP)

El servidor MCP oficial de FlowConsent, `https://mcp.flowconsent.com`, funciona con Claude, ChatGPT o cualquier cliente MCP, con conexión OAuth 2.0 a la cuenta de FlowConsent (sin clave de API). El agente obtiene el fragmento y las instrucciones de colocación (`get_banner_snippet`, `get_setup_instructions`), verifica la instalación con un escaneo real (`verify_consent_compliance`) y puede programar una vigilancia periódica (`monitor_compliance`). No modifica la configuración de HubSpot: pegar el fragmento sigue siendo un paso manual.

Ejemplo de petición: «Deme el fragmento de código de mi banner para mi sitio HubSpot y compruebe que está bien instalado en https://misitio.es».

Ver la [guía del servidor MCP](/es/doc/mcp-server) y la página [FlowConsent MCP](/es/mcp).

## Preguntas frecuentes

### ¿El fragmento cubre también las landing pages y el blog de HubSpot?

El campo Site header HTML se aplica al contenido alojado en HubSpot en el dominio elegido. Tras guardar, conviene comprobar una landing page y un artículo del blog con el asistente de instalación.

### El sitio no está alojado en HubSpot, solo tiene instalado el código de seguimiento. ¿Qué hacer?

Esta página no aplica: hay que instalar FlowConsent en la plataforma que aloja el sitio y declarar HubSpot en **Builder → Servicios**.

### ¿Se puede mantener el banner de HubSpot junto a FlowConsent?

No es recomendable: dos banners molestan al visitante y pueden registrar decisiones distintas. Lo correcto es un único banner, FlowConsent, con el indicador `disableHubSpotCookieBanner`.

### ¿Por qué no aparece el campo Site header HTML?

Hacen falta el permiso **Website settings** y una suscripción de HubSpot que permita código en la cabecera. Un superadministrador de la cuenta de HubSpot puede concederlo.