Asistente de instalación: una instalación verificada, paso a paso

El asistente de instalación vive en la pestaña Deployment del Builder, una vez desplegado tu banner. Hace más que darte un snippet: cada paso se verifica contra tu sitio real. El asistente no dice «pega este código» — descarga tu página y constata que está hecho, después demuestra que el banner se respeta con un escaneo de rechazo, y termina en la vigilancia continua en lugar de en un «ya está».

Paso 1 — Añade el snippet para tu plataforma

La tarjeta de integración ofrece el snippet en tres variantes: HTML / No-code, Webflow y Next.js. Todas contienen las mismas dos partes, en este orden:

Un stub de Consent Mode inline que registra valores por defecto denied para todas las señales de Google.
El cargador de FlowConsent, que muestra el banner y aplica la elección del visitante.

index.html

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://TU-CODIGO-LICENCIA.consent.flowconsent.com/cookie-manager.js?code=TU_CODIGO_LICENCIA"></script>

Las particularidades por plataforma, tal como las muestra el asistente:

Webflow — pega el snippet en Site settings → Custom code → Head code y publica. Retira cualquier Measurement ID de Google Analytics de Site settings → Apps & Integrations: Webflow lo inyecta por encima de tu código personalizado, así que su configuración gtag se ejecutaría antes de los valores por defecto de consentimiento y ninguna CMP podría controlarla.
Next.js — el asistente genera una versión app/layout.tsx que usa <Script strategy="beforeInteractive"> para el stub y el cargador. Para la navegación del lado del cliente, activa además el modo SPA en la pestaña Settings — consulta la guía de integración con Next.js.

Paso 2 — Verifica tu instalación

Introduce la URL de tu página y haz clic en Verificar. FlowConsent descarga la página desde sus servidores y comprueba, en el HTML real:

la página es accesible (con el estado HTTP si no lo es);
el cargador de FlowConsent está presente con tu código de licencia — si se encuentra un cargador con un código distinto, el asistente te dice cuál;
el stub de Consent Mode está presente — si falta, probablemente pegaste solo el segundo bloque <script>;
si hay una etiqueta de Google en la página, el stub se ejecuta antes que ella — de lo contrario sus cookies no pueden controlarse, y el asistente muestra la URL de la etiqueta culpable.

Paso 3 — Lanza un escaneo de rechazo

Un banner instalado no prueba nada por sí solo: lo que cuenta es lo que se ejecuta cuando un visitante rechaza. Este paso carga tu página en un navegador real con el consentimiento rechazado y lista todo lo que se dispara igualmente. Usa el perfil rápido — un veredicto en unos 30–60 segundos — y muestra la misma insignia de veredicto que la página de Conformidad (Conforme, Avisos o Violaciones), más el número de violaciones.

La auditoría exhaustiva, las sugerencias de páginas y el historial de escaneos viven en la página de Conformidad.

Paso 4 — Activa la vigilancia semanal

El último paso no cierra la instalación — la mantiene probada. Haz clic en Vigilar esta página cada semana: el mismo escaneo de rechazo se relanza cada semana y te alerta ante una regresión (una etiqueta añadida por un equipo de marketing, un ajuste del site builder reactivado). En cuanto existe un monitor para la página, el asistente lo muestra como activo.

Lado servidor (opcional)

La mitad de los tratamientos sujetos a consentimiento ocurre del lado del servidor — GA4 Measurement Protocol, sincronización con el CRM, analítica propia. El asistente cubre también ese recorrido.

Lee el contrato de consentimiento con el SDK de servidor

El asistente genera un snippet readConsent() con el configHash actual de tu banner ya inyectado. Un consentimiento dado antes de un cambio del banner es inválido — el hash hace que tu servidor lo trate como pendiente de re-consentimiento:

handler.js

import { readConsent } from '@flowconsent/server-sdk'
 
export async function handler(request) {
  const consent = readConsent(request, {
    // Hash de la config publicada: una elección anterior a un
    // cambio del banner es inválida (re-consentimiento).
    expectedConfigHash: 'TU_CONFIG_HASH_ACTUAL',
  })
  if (consent.can('analytics')) {
    // GA4 Measurement Protocol, analítica propia…
  }
  if (consent.can('marketing')) {
    // sincronización CRM, audiencias…
  }
}

Consulta la guía del SDK de servidor para la API completa.

Webhook de consentimiento, probado con un evento firmado real

Añade la URL de un endpoint y el asistente crea un webhook de consentimiento con un secreto de firma en formato whsec_….

Después haz clic en Enviar test firmado: FlowConsent entrega un evento consent.test real y firmado a tu endpoint y reporta el resultado — entregado, con el estado HTTP y el tiempo de respuesta, o el detalle del fallo. Tu integración queda confirmada por una entrega real, no por una marca verde de buena fe.