Integraciones

Consentimiento de cookies para Hugo y Jekyll

Un sitio estático no necesita servidor para esto: el banner es una etiqueta en la plantilla que renderiza el <head>, con la clave en la configuración del sitio. Las decisiones las registra Croombit, no tu sitio.

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 y mantén las categorías de cookies que trae. Escribe el texto del banner y publícalo. Crea una clave publicable de TEST para localhost:3000. Es un sitio Hugo (o Jekyll): añade la etiqueta de cmp.js al principio del <head> en la plantilla que lo renderiza, con la clave de los parámetros del sitio (croombitKey en hugo.toml, o croombit_key en _config.yml), y cambia nuestras etiquetas de analítica a type="text/plain" con data-tc-consent.

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

Hugo

Pon la clave en tu configuración. hugo server usa el entorno development, así que un config/development/hugo.toml puede llevar la clave de TEST.

# hugo.toml (config/development/hugo.toml can hold the pk_test_ key for `hugo server`)
[params]
  croombitKey = "pk_live_…"

Después, la etiqueta, la primera del <head>. Si ese archivo viene de tu tema, cópialo a la misma ruta dentro de layouts/ de tu proyecto para sobrescribirlo.

{{/* layouts/partials/head.html — or wherever your theme renders <head> */}}
<meta charset="utf-8">
<script src="https://croombit.com/cmp.js" data-tc-api-key="{{ site.Params.croombitKey }}"></script>
{{/* …everything else after it */}}

Jekyll

# _config.yml
croombit_key: pk_live_…

<!-- _includes/head.html (copy it from your theme to override it) -->
<meta charset="utf-8">
<script src="https://croombit.com/cmp.js" data-tc-api-key="{{ site.croombit_key }}"></script>

Retén los rastreadores

Cambia su type a text/plain y añade data-tc-consent. La plantilla interna de Google Analytics de Hugo no se puede etiquetar: quítala y pega en su lugar el fragmento de abajo.

<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>

Lista de cookies y enlace de ajustes

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

Preguntas

¿Funciona en GitHub Pages, Netlify o Cloudflare Pages?

Sí. Es HTML normal; cualquier hosting estático lo sirve.

¿Cómo mantengo la lista de cookies al día?

Lanza un escaneo desde la consola, o prográmalo. La tabla data-tc-cookie-declaration se rellena sola con el último escaneo, sin recompilar el sitio.