Consentimiento de cookies para cualquier web

HTML estático, una aplicación renderizada en servidor (Rails, Laravel, Django, Express) o un constructor de webs que te deje editar el <head>: el banner es una etiqueta script. Bloquea los rastreadores hasta que el visitante elige, registra cada decisión con prueba y envía las señales de Google Consent Mode v2.

Configúralo con tu agente de IA

Conecta el servidor MCP de Croombit a tu editor o agente de código y pega esto. Crea el sitio, las categorías de cookies y el banner, y edita tu código.

Con Croombit: crea un sitio para este proyecto con las categorías de cookies Analítica (ANALYTICS) y Publicidad (MARKETING), desactivadas por defecto, publícalas y publica el banner. Crea una clave publicable de TEST para localhost:3000. Añade la etiqueta script de Croombit la primera en el <head> de todas las páginas, y cambia nuestras etiquetas <script> de analítica y anuncios a type="text/plain" con data-tc-consent igual a su categoría.

El agente trabaja en TEST. Pasar a LIVE son dos pasos en la consola: verificar tu dominio y cambiar a una clave LIVE; consulta pasar a LIVE.

O a mano

1. Añade la etiqueta la primera en el <head>

Antes de cualquier etiqueta de analítica o marketing, para poder retenerlas. Usa una clave pk_test_… mientras desarrollas y la pk_live_… cuando tu dominio esté verificado.

<script src="https://croombit.com/cmp.js"
        data-tc-api-key="pk_live_…"></script>

2. Retén tus rastreadores

Cambia type a text/plain y añade data-tc-consent con la categoría. La etiqueta queda inactiva hasta que el visitante concede esa categoría y después se ejecuta con normalidad. Los proveedores conocidos (Google, Meta, Hotjar, Clarity…) insertados por JavaScript también se bloquean automáticamente, pero etiquetarlos es la garantía.

<script type="text/plain" data-tc-consent="analytics" async
        src="https://www.googletagmanager.com/gtag/js?id=G-XXXX"></script>
<script type="text/plain" data-tc-consent="analytics">
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXX');
</script>
Las etiquetas de Google reciben además los valores denied de Consent Mode v2 antes de cargarse, y un update en cuanto el visitante decide.

3. Deja que el visitante cambie su elección

Añade un enlace donde quieras, normalmente en el pie. Reabre el panel con sus elecciones actuales ya marcadas.

<a href="#" data-tc-open-preferences>Configurar cookies</a>

4. Publica la lista de cookies

En tu página de política de cookies, esto se rellena solo con cada cookie que encontró el escáner, agrupada por categoría y con la fecha del último escaneo.

<div data-tc-cookie-declaration></div>

Preguntas

¿Funciona con un constructor de webs?

Sí, si te deja añadir código al <head> de todas las páginas. Pega ahí la etiqueta, lo más arriba que permita.

¿Necesito un desarrollador para mantener al día la lista de cookies?

No. Lanza un escaneo desde la consola, o prográmalo; la tabla de declaración se actualiza con el último escaneo.