Nascondere i banner dei cookie su ogni sito — 5 snippet pronti all'uso

15 maggio 2026 · di JustZix Team

Il GDPR doveva darci il controllo sui cookie. Ci ha dato pop-up che coprono il 30% dello schermo su un sito su due. Questo articolo mostra cinque modi per liberarsi di quel muro una volta per tutte — con CSS, JavaScript e l'estensione JustZix.

È legale?

Sì. Il GDPR e la direttiva ePrivacy impongono obblighi al gestore del sito (deve chiedere il consenso prima di impostare i cookie). Dalla tua parte — come utente — sei libero di modificare l'aspetto di un sito nel tuo browser. Come qualsiasi ad blocker o la modalità Lettura di Safari. Una precisazione importante: nascondere il banner di norma non equivale al consenso ai cookie — la maggior parte dei siti continua a impostare solo i cookie strettamente necessari finché non clicchi esplicitamente su «Accetta».

Metodo 1 — CSS universale sulle classi più comuni

Il più semplice e sicuro. Cattura ~80% dei banner sul web:

/* Banner dei cookie — classi e ID più comuni */
.cookie-banner,
.cookie-notice,
.cookie-consent,
.gdpr-banner,
.consent-banner,
#cookie-notice,
#cookieConsent,
#onetrust-banner-sdk,
[class*="CookieConsent"],
[id*="cookie-bar"] {
  display: none !important;
}

/* Molti banner bloccano lo scroll del body fino al clic */
html, body {
  overflow: auto !important;
  position: static !important;
}

Il secondo blocco è cruciale — molti banner impostano overflow: hidden su <body> per bloccare lo scroll finché non accetti. Forzare overflow: auto ripristina il comportamento normale.

Metodo 2 — selettori di attributo aggressivi

Quando un sito usa nomi di classe dinamici (Tailwind, CSS-in-JS) e il pattern di base non corrisponde, mira agli attributi:

/* Cattura tutto ciò che ha "cookie" o "consent" nella classe / ID */
[class*="cookie" i],
[id*="cookie" i],
[class*="consent" i],
[id*="consent" i],
[class*="gdpr" i],
[role="dialog"][aria-label*="cookie" i] {
  display: none !important;
}

Il flag i nei selettori di attributo (es. [class*="cookie" i]) li rende case-insensitive. Senza, .CookieBanner non corrisponderebbe a "cookie".

Avvertenza: questo snippet può catturare troppo — es. un articolo sui cookie (la legge!) verrà nascosto anche lui. Usalo con criterio, idealmente in una cartella di regole limitata a domini specifici.

Metodo 3 — selettore `:has()` (moderno)

Da Chrome 105 e Safari 15.4 puoi usare :has() — un selettore che mira a un elemento che contiene un figlio corrispondente a un pattern. Perfetto per i banner dei cookie, perché hanno sempre un pulsante «Accetta» all'interno:

/* Versione pratica — mira ai contenitori fixed/sticky con un pulsante Accept */
div:has(> button[aria-label*="Accept" i]),
div:has(> button[aria-label*="cookie" i]),
aside:has(> button[aria-label*="consent" i]) {
  display: none !important;
}

CSS non supporta :contains() (è un'invenzione di jQuery). Miriamo invece all'attributo aria-label — i banner ben progettati lo hanno comunque per gli screen reader.

Metodo 4 — JavaScript clicca «Accetta» automaticamente

Quando il CSS non basta (banner nello Shadow DOM, blocco a pagina intera), il JS clicca per te. Più veloce di quanto te ne accorga:

// Clicca automaticamente i pulsanti "Accetta" — funziona anche negli iframe
let attempts = 0;
const interval = setInterval(() => {
  if (++attempts > 20) return clearInterval(interval);

  const candidates = [
    ...document.querySelectorAll('button, a[role="button"], input[type="button"]')
  ];

  const target = candidates.find(el => {
    const text = (el.textContent || el.value || '').trim().toLowerCase();
    const aria = (el.getAttribute('aria-label') || '').toLowerCase();
    return /^(accetta tutto|accetta|acconsento|consenti tutto|accept all|accept)$/i
      .test(text) || /accept|accetta|consenti/.test(aria);
  });

  if (target) {
    target.click();
    clearInterval(interval);
  }
}, 500);

Sonda ogni 500ms per 10 secondi (20 tentativi × 500ms). Trova il primo pulsante corrispondente — clicca e si ferma. In pratica: non vedi nemmeno il banner.

Nota etica: cliccando «Accetta» acconsenti ai cookie di marketing. Se la cosa ti dà fastidio — usa i Metodi 1+2 (nascondere senza accettare). Il sito ti vede allora come un utente anonimo che semplicemente non ha risposto.

Metodo 5 — Shadow DOM (casi estremi)

OneTrust, Cookiebot, Usercentrics — i SaaS di banner cookie più diffusi — spesso rendono la loro UI dentro lo Shadow DOM. Il CSS esterno allo shadow root non può raggiungerlo. Serve JS:

// Trova l'elemento host (per nomi comuni), entra nel suo shadowRoot
function hideShadowBanners() {
  const hosts = document.querySelectorAll(
    '#onetrust-consent-sdk, #usercentrics-root, #CybotCookiebotDialog'
  );

  hosts.forEach(host => {
    host.style.display = 'none';
    // Più il contenuto shadow (se usa lo shadow DOM)
    if (host.shadowRoot) {
      const style = document.createElement('style');
      style.textContent = ':host { display: none !important; }';
      host.shadowRoot.appendChild(style);
    }
  });
}

// Prima esecuzione + observer per gli inserimenti tardivi
hideShadowBanners();
new MutationObserver(hideShadowBanners)
  .observe(document.body, { childList: true, subtree: true });

Il MutationObserver cattura anche i banner che si inseriscono dopo DOMContentLoaded — tipicamente gli script di tracking caricano in modo asincrono e il banner appare 1-2 secondi dopo il caricamento della pagina.

Come collegarlo a JustZix

Installa l'estensione (pagina di download — ZIP, 2 minuti).
Clicca l'icona JustZix → «Nuova regola».
Pattern URL: * (per applicare ovunque) o https://example.com/* (un dominio).
Nella scheda CSS incolla il Metodo 1 (universale) — lascialo attivo.
Se incappi in un sito dove non viene nascosto nulla — aggiungi il Metodo 4 come regola JS, limitata a quel dominio.
Sincronizza la tua chiave tra i dispositivi — il banner sparisce sul portatile, sul PC e sul computer di lavoro contemporaneamente.

Trappole da evitare

Non impostare display: none su html o body — nasconderesti l'intera pagina.
Il caricamento della pagina può rallentare leggermente — il JS di auto-accettazione che sonda 20 volte impegna l'event loop. In pratica impercettibile.
Alcuni paywall si travestono da banner dei cookie (es. i grandi siti di notizie) — nascondere il banner non sblocca il contenuto. Lì aiuta solo una regola dedicata per sito.
Il banner di un negozio può essere richiesto per legge (es. consenso al checkout). Non nasconderlo sui siti dove pensi di acquistare.

Cosa fare dopo

Lo stesso approccio funziona per gli altri killer della UX: pop-up di newsletter, «attiva le notifiche», anteprime di paywall. Guarda altri snippet pronti all'uso nella sezione Esempi, oppure casi d'uso reali per JustZix.

Installa JustZix e scrivi le tue regole. Il primo snippet di questo articolo incollato nell'estensione = il banner sparisce sull'80% dei siti. Il resto è solo iterazione per dominio problematico.

Valuta questo articolo

Nessuna valutazione — sii il primo.

Nascondere i banner dei cookie su ogni sito — 5 snippet pronti all'uso

È legale?

Metodo 1 — CSS universale sulle classi più comuni

Metodo 2 — selettori di attributo aggressivi

Metodo 3 — selettore :has() (moderno)

Metodo 4 — JavaScript clicca «Accetta» automaticamente

Metodo 5 — Shadow DOM (casi estremi)

Come collegarlo a JustZix

Trappole da evitare

Cosa fare dopo

Valuta questo articolo

Vedi anche

Ritocchi per Booksy: un calendario più chiaro e una modalità focus

Ritocchi per Allegro: più tranquillo, più denso e senza annunci sponsorizzati

Ritocchi per Canva — un editor più grande e meno rumore

Provalo tu stesso

Metodo 3 — selettore `:has()` (moderno)