el producto

El banner

El banner se edita en cuatro pantallas (Diseño, Textos, Reglas, Versiones) alrededor de una vista previa en directo que muestra el runtime real, no una maqueta. Publicar crea versiones numeradas e inmutables; vista previa y producción son dos documentos separados.

el editorCómo está organizado el editor

Una franja arriba contiene lo que es cierto en cada pantalla: qué documento estás editando (borrador de vista previa o de producción), el estado de guardado (los borradores se guardan solos), la píldora de lint y el botón Publicar. Debajo, cuatro pantallas:

• Diseño: elige un diseño de partida y personalízalo.
• Textos: cada texto que muestra el banner, por idioma.
• Reglas: categorías, regiones, Google Consent Mode y comportamiento, cada uno en su propia pantalla.
• Versiones: el libro de todo lo que se ha publicado.

La vista previa en directo acompaña a las pantallas en las que ver ayuda (Diseño, Textos, Categorías) y se aparta donde no puede mostrar nada (Regiones, Consent Mode, Comportamiento). Ejecuta el runtime real del banner y simula un visitante: elige un país, un conjunto de reglas, escritorio o teléfono, la primera pantalla o el panel de ajustes, incluso una señal Global Privacy Control. Los controles no cambian nada; son una simulación, y la vista previa lo dice.

diseñoPreajustes, y cómo hacer uno tuyo

Los sitios nuevos empiezan en Estándar: un diálogo blanco centrado con tres botones azules iguales (Aceptar todo, Ajustes, Rechazar todo), la forma que la mayoría de visitantes europeos ya conocen. Diez diseños integrados más cubren desde barras discretas que heredan la tipografía de tu página hasta avisos llamativos, deliberadamente imposibles de pasar por alto, más una variante en página que no cubre nada y un modo headless donde construyes la interfaz tú mismo sobre la API del runtime.

Varios de los diseños integrados vienen de un sistema de diseño inspirado en la imprenta: dos tintas sobre un papel, con la profundidad hecha por una segunda plancha sólida desplazada en vez de sombras, y el registro de consentimiento renderizado como un recibo arrancado del borde del banner. No necesitas entender nada de eso para usarlos; cada tarjeta de preajuste muestra exactamente cómo queda, y «Probar» previsualiza un diseño sin cambiar nada hasta que lo aplicas.

Bajo «Personalizar este diseño» el conjunto completo de controles está siempre disponible: siete diseños (barra, hoja, modal, esquina, cinta, en página, headless), posición, colores con comprobación de contraste en directo, tipografía, radio y CSS propio. Dos reglas se cumplen en todo diseño: Aceptar y Rechazar son objetos idénticos, y un visitante siempre puede volver a entrar para cambiar de opinión.

Tus páginas: cada banner enlaza tu aviso legal y tu política de privacidad en su pie. Ambos son obligatorios, y la publicación se bloquea hasta que ambos sean URL reales. Es deliberado: un banner de consentimiento en la UE sin ellos se busca problemas.

El pie del banner lleva una pequeña línea «Made & Hosted in Europe by CookieCrumbs» que enlaza a cookiecrumbs.eu. Quitarla es parte de los planes de pago; en el plan Free la línea siempre se muestra, y publicar una configuración que la oculte está bloqueado.

textosTextos, agrupados por dónde aparecen

La pantalla Textos lista cada texto en el orden en que un visitante lo encuentra, no en el orden del esquema: la primera pantalla (título, cuerpo, los tres botones), el panel de ajustes (botón de guardar, etiqueta del id de consentimiento) y la letra pequeña alrededor de ambos (enlaces del pie, el control de reapertura, el selector de idioma). Los textos que tu configuración actual no usa se pliegan en una línea al final; los textos condicionales aparecen exactamente cuando una regla o comportamiento los hace obligatorios, marcados como tales.

Al enfocar un campo, la vista previa salta a la pantalla en la que vive ese texto, en el idioma que estás editando. Así siempre ves lo que estás cambiando.

Idiomas

Un banner puede hablar hasta cuarenta idiomas (la cuota exacta depende del plan). Siete llegan totalmente traducidos: inglés, alemán, francés, neerlandés, español, italiano y portugués de Brasil, con redacción y descripciones de categorías incluidas. Cualquier otra etiqueta BCP 47 empieza como copia de tu idioma por defecto para que la traduzcas. Cada chip de idioma muestra cuántos textos siguen vacíos; al traducir, «Comparar con inglés» pone el texto de referencia bajo cada campo con un botón de copiar. El selector de idioma para visitantes aparece automáticamente cuando hay más de un idioma configurado, y se puede desactivar.

reglasCategorías, regiones, comportamiento

Categorías

Las categorías son los interruptores de tu banner: Necesarias, Analítica, Marketing y Preferencias por defecto, más las que añadas. Necesarias está bloqueada en activado. Cada categoría lleva su nombre y descripción por idioma, sus señales de Google Consent Mode y si está activada por defecto (bajo reglas de opt-in, solo Necesarias puede estarlo). Las categorías personalizadas se pueden añadir aquí o directamente en la página Cookies y rastreadores; ambas editan el mismo borrador. Todo lo que cambies es visible de inmediato en el panel de ajustes de la vista previa, porque las categorías son ese panel.

Regiones

Primero una pregunta: ¿dónde están tus visitantes? Europa, Europa y el Reino Unido, o todo el mundo. La respuesta activa los conjuntos de reglas correctos y la pantalla enuncia el resultado en una frase honesta. Todo lo demás (ajustes por régimen, caducidad del consentimiento, excepciones por país, un régimen forzado para pruebas) está bajo Avanzado. Los detalles de cada régimen están en Regiones y regímenes.

Consent Mode

Si usas etiquetas de Google, el banner les pasa cada decisión. Consulta Google Consent Mode.

Comportamiento

Lo que ocurre alrededor de la decisión. Volver a preguntar tras un cambio sustancial (activado por defecto): cuando una versión se publica como sustancial, es decir, con nuevas finalidades o señales, a los visitantes que ya decidieron se les vuelve a preguntar. Recordar un rechazo de uno a trece meses. Mostrar el ID de consentimiento para que los visitantes puedan citarlo al ejercer sus derechos. El control de reapertura es un botón flotante o un enlace que colocas en tu propio pie; uno de los dos es obligatorio, porque retirar el consentimiento debe seguir siendo tan fácil como darlo. Cerrar el banner puede configurarse para que cuente como rechazo; si lo activas, el aviso que lo indica a los visitantes se vuelve obligatorio, y la lectura más estricta es siempre la opción por defecto.

lintLa píldora de lint

El editor revisa el borrador continuamente y el servidor lo revisa de nuevo al publicar; los dos nunca pueden divergir porque ejecutan las mismas reglas. Los hallazgos bloqueantes (falta el aviso legal, falta la política de privacidad, una categoría a la que apunta un servicio que ya no existe, un régimen de respaldo desactivado) detienen la publicación con un mensaje en palabras claras y un enlace al campo exacto. Las advertencias aconsejan pero no bloquean.

publicaciónVersiones, y qué logró cada una

Publicar crea una versión numerada inmutable, registra quién la publicó y desde dónde, y escribe una entrada de auditoría. El diálogo de publicación pide una nota breve y si el cambio es sustancial. Vista previa y producción se publican por separado; promover pone en producción la versión de vista previa actual.

La pantalla Versiones es un libro, y cierra un círculo que la mayoría de herramientas de consentimiento dejan abierto: cada versión que sirvió en producción muestra su tasa de opt-in y el cambio respecto a la versión anterior. Una versión que nunca llegó a producción, o que tiene muy pocas decisiones para informar con honestidad, muestra un guion y dice por qué. Restaurar y promover están en la propia fila; aquí nunca se sobrescribe nada, así que volver atrás es seguro por construcción. Cada versión publicada recibe además capturas renderizadas (escritorio y teléfono, ambas pantallas del banner) y una comprobación de accesibilidad automatizada, guardadas con la versión como prueba de lo que vieron los visitantes.