Come personalizzare il cookie banner di My Agile Privacy®

Questa guida ti aiuterà a configurare il Cookie Banner di My Agile Privacy® in base alle tue esigenze di design.
Ecco le principali opzioni di personalizzazione disponibili.

Personalizzazione grafica del Cookie Banner

Il Cookie Banner può essere configurato per adattarsi allo stile del tuo sito. Ecco alcune opzioni:

• Dimensioni e layout: 4 layout tra cui scegliere — Grande e Brandizzato (predefinito), Grande, Largo e Riquadrato.
• Posizionamento: verticale (alto, centro o basso pagina); orizzontale (sinistra, centro, destra), disponibile con i layout Grande e Riquadrato.
• Banner flottante: il banner può fluttuare staccato dai bordi della pagina oppure aderire ai bordi.
• Ombra ed effetto di comparsa: ombreggiatura (leggera o marcata) e animazione di ingresso (scorrimento o dissolvenza).
• Titolo del banner: attivabile, con colori dedicati per testo e sfondo dell’intestazione.
• Colori: preimpostazioni pronte all’uso (Chiaro, Scuro e altre) oppure colori personalizzati per sfondo, testo e pulsanti.
• Pulsanti: ordine di visualizzazione di Accetta, Rifiuta e Personalizza e icone nei pulsanti.
• Tipografia: dimensione font e spazio tra le righe.
• Raggio di curvatura: per angoli arrotondati su banner e pulsanti.

Visualizza sempre un’anteprima in tempo reale prima di pubblicare.

Queste opzioni sono disponibili dal menu My Agile Privacy® nell’admin di WordPress.

Personalizzazione avanzata: CSS custom e wrapper

Se desideri una personalizzazione più profonda, vai su My Agile Privacy® > Avanzate e sfrutta le opzioni custom CSS e wrapping.
Nota: sconsigliamo questa funzione se non hai conoscenze base di CSS.

Custom CSS

Permette di scrivere CSS personalizzato che viene incluso ovunque sul sito. Il banner ha un ID specifico: my-agile-privacy-notification-area. Puoi targettare questo ID o i suoi elementi interni per modificare aspetto, colori, bottoni, ecc.

I dettagli di ID e classi sono visibili dalla console JS del browser esaminando il banner.

Wrapping CSS

Se attivi questa opzione, i testi delle policy pubblicati via shortcode avranno il wrapper .myagileprivacy_text_wrapper. Così puoi personalizzare via CSS colore, font, dimensione, ecc.

Inserisci le regole CSS sempre nel campo "Custom CSS".

Personalizzazione dei testi

Puoi modificare ogni testo del banner dalla sezione My Agile Privacy® > Testi e Traduzioni.
Puoi vedere subito l’anteprima e modificare testi per ogni lingua attiva nel tuo piano.


Nota: consulta il tuo consulente privacy prima di modificare i testi per non perdere conformità.

Reset dei testi

Puoi ripristinare i testi originali con l’opzione "Vuoi ritornare ai contenuti di default? Clicca qui per resettare la lingua corrente".
Dopo il reset, salva le modifiche.

Come personalizzare il widget di rivisitazione consenso

Gli utenti devono poter rivedere le scelte in qualsiasi momento. Configura il widget dal box Widget di rivisitazione del consenso nella tab Consenso.
Se lo nascondi, aggiungi link/button visibile (es. nel footer) che permetta di riaprire le preferenze. Le istruzioni sono nella tab.

Nota bene: se disabiliti il widget di consenso, è necessario inserire lo shortcode dedicato e indicato nelle istruzioni della tab, per permettere agli utenti di poter rivedere in qualunque momento le proprie scelte. Se il widget di rinconsenso è disabilitato, e lo shortcode non è stato inserito, allora il widget di riconsenso verrà comunque visualizzato. Questo è un modo per aiutarti a mantenere il tuo sito conforme.

Come mostrare messaggi di avviso per cookie non accettati

Con My Agile Privacy® puoi mostrare un avviso quando certi cookie non sono stati accettati (es. recapcha, moduli newsletter, mappe, ecc).
Nella tab Banner dei Cookie trovi due opzioni pronte all’uso:

• Barra di notifica: mostra sul sito una barra che elenca i contenuti bloccati nella pagina corrente finché non viene espresso il consenso. Puoi mostrarla anche prima di qualsiasi scelta di consenso e impostarne la chiusura automatica con un timeout.
• Widget del contenuto bloccato: al posto del contenuto bloccato (ad esempio una mappa di Google) compare un widget segnaposto, di cui puoi impostare il colore del testo e dello sfondo.

In alternativa, o in aggiunta, puoi inserire manualmente un blocco html dove vuoi che appaia l’avviso:

Cliccando, il banner cookie si riapre così l’utente può modificare le preferenze.

Messaggi personalizzati per cookie specifici

Quando un contenuto viene bloccato perché il visitatore non ha dato il consenso al cookie che lo governa, puoi mostrare al suo posto un avviso cliccabile che riapre il pannello delle preferenze.

Dalla versione 3.3.7 il codice te lo genera il plugin.

Come si fa

1. Apri My Agile Privacy® › Elenco cookie e clicca sul cookie che ti interessa (per esempio Google reCAPTCHA).
2. Nel riquadro Tipologia di installazione premi Genera il codice del widget di riconsenso.
3. Se il tuo sito è multilingua, scegli la lingua dal menu a tendina.
4. Premi Copia e incolla il codice nella pagina, nel punto in cui compare l'elemento bloccato.

Non devi cercare né sostituire nessuna chiave: il codice generato contiene già quella del cookie che stai modificando.

Come si comporta l'avviso

L'avviso è visibile solo a chi non ha accettato quel cookie. Quando il visitatore dà il consenso, il messaggio scompare da sé e il contenuto bloccato torna disponibile. Chi ha già accettato in una visita precedente non lo vede affatto.

Il testo è cliccabile: al clic si riapre il pannello delle preferenze cookie.

Puoi modificare il testo

Il codice generato è normale HTML: il messaggio fra i due tag lo puoi riscrivere come preferisci. Non modificare invece le classi (map_custom_notify, map_api_key_…, showConsentAgain, mapShowItem): sono quelle che legano l'avviso al cookie e ne governano la comparsa.

Un avviso per cookie, per pagina

Se nella stessa pagina hai più elementi bloccati dal medesimo cookie, inserisci un solo avviso. Per cookie diversi puoi inserirne uno per ciascuno.

In alternativa: procedura manuale

Se preferisci scrivere il codice a mano, o stai lavorando su una versione precedente alla 3.3.7:

1. Individua il cookie in My Agile Privacy® › Elenco cookie e aprine il dettaglio (es. Google reCAPTCHA).
2. Copia la sua API KEY dalle impostazioni del cookie (es. google_recaptcha).
3. Personalizza questo codice:

<div class="map_custom_notify map_api_key_APIKEYQUI showConsentAgain mapShowItem">
Attenzione: le tue scelte cookie non permettono la visualizzazione di questo elemento. Clicca qui per rivedere le tue preferenze.
</div>

4. Sostituisci APIKEYQUI con la chiave del cookie. Il messaggio testuale puoi cambiarlo.

Esempio per RECAPTCHA:

<div class="map_custom_notify map_api_key_google_recaptcha showConsentAgain mapShowItem">
Attenzione: le tue scelte cookie non permettono l'invio del form. Clicca qui per rivedere le tue preferenze.
</div>

Risorse utili

Per una configurazione completa consulta:

• Guida al Cookie Shield
• Come mettere a norma i moduli di contatto