Cómo ocultar muros de cookies y ventanas de consentimiento con CSS
Los banners de cookies son el peaje que pagas por visitar casi cualquier sitio web en 2026. Cubren el contenido, bloquean el desplazamiento y exigen un clic antes de que puedas leer una sola palabra. Con JustZix puedes hacerlos desaparecer automáticamente en cada sitio que elijas.
Por qué una regla CSS supera a hacer clic en "Rechazar todo"
Pasar por los diálogos de consentimiento es repetitivo y lento, y muchos de ellos esconden el botón "Rechazar" tras un menú adicional. Una regla de JustZix se ejecuta en el momento en que la página carga, así que el banner nunca tiene la oportunidad de interrumpirte. La configuras una vez por sitio (o una vez con un patrón de URL amplio) y te olvidas de ella.
El truco es que la mayoría de los banners son simples elementos del DOM con nombres de clase predecibles. Oculta el elemento, restaura el desplazamiento y la página se comporta como si el banner nunca hubiera existido.
Receta 1: ocultar el banner y restaurar el desplazamiento
La mayoría de las bibliotecas de consentimiento bloquean la página añadiendo overflow: hidden al elemento <body> o <html>. Ocultar solo el banner no es suficiente: también tienes que desbloquear el desplazamiento.
/* Limpieza genérica del banner de cookies */
[id*="cookie"], [class*="cookie-banner"],
[class*="consent"], [id*="consent"],
[aria-label*="cookie" i] {
display: none !important;
}
/* Restaurar el desplazamiento que el banner bloqueó */
html, body {
overflow: auto !important;
position: static !important;
}El indicador i dentro de [aria-label*="cookie" i] hace que la coincidencia no distinga mayúsculas, así que captura "Cookie", "COOKIE" y "cookie" por igual.
Receta 2: eliminar la capa de fondo oscura
Algunos sitios oscurecen toda la página detrás del diálogo con una superposición fija a pantalla completa. Incluso después de ocultar el diálogo, esa capa gris puede quedarse y tragarse tus clics.
/* Eliminar el fondo de oscurecimiento */
.modal-backdrop, .overlay, .cookie-overlay,
[class*="backdrop"], [class*="scrim"] {
display: none !important;
pointer-events: none !important;
}Receta 3: un respaldo JS para banners persistentes
Un puñado de herramientas de consentimiento reconstruyen el banner después de que el CSS carga, o lo renderizan dentro de un shadow DOM al que el CSS no puede llegar. Para esos, una pequeña regla de JavaScript hace el trabajo. JustZix la ejecuta en las páginas que elijas.
// Eliminar nodos de consentimiento renderizados tarde
const KILL = ['cookie', 'consent', 'gdpr', 'privacy-banner'];
function sweep() {
document.querySelectorAll('div, section, aside').forEach(el => {
const id = (el.id + ' ' + el.className).toLowerCase();
if (KILL.some(k => id.includes(k)) && el.offsetHeight < 600) {
el.remove();
}
});
document.documentElement.style.overflow = 'auto';
document.body.style.overflow = 'auto';
}
sweep();
new MutationObserver(sweep).observe(document.body, {
childList: true, subtree: true
});La protección offsetHeight < 600 es una red de seguridad: impide que el script borre un artículo genuino que casualmente mencione "privacy" en un nombre de clase.
Apuntar a las URL correctas
Si quieres esto en todas partes, usa un patrón comodín como *://*/*. Si un sitio concreto se rompe, limita la regla solo a ese dominio. JustZix te permite mantener tanto una regla global de limpieza como anulaciones por sitio, y la regla más específica gana.
- Global:
*://*/*para el CSS genérico de arriba. - Por sitio:
https://news.example.com/*para un selector ajustado.
Cuándo dejar de ocultar y empezar a hacer clic
Ocultar un banner con CSS no envía una elección de consentimiento al sitio. Para la mayoría de las lecturas eso está bien: sin banner, sin diálogo de seguimiento. Pero si un sitio realmente se niega a funcionar hasta que respondas, haz clic en "Rechazar todo" una vez y deja que JustZix oculte el banner en las visitas posteriores.
Empieza ya
Consigue la extensión en la página de descargar JustZix y luego explora nuestros ejemplos listos para usar para más fragmentos de limpieza. Una vez que los banners desaparezcan, la siguiente molestia suelen ser las ventanas emergentes: consulta nuestra guía sobre eliminar ventanas emergentes de boletines y registro.
Cinco minutos de configuración te compran una web más limpia para siempre. Guarda tus reglas, expórtalas como copia de seguridad y disfruta de páginas que cargan directamente al contenido.
Valora este artículo
Sin valoraciones — sé el primero.