Pubblicato il 22/05/18 - aggiornato il  | 30 commenti :

GDPR: come personalizzare l'informativa breve in Blogger

Come modificare l'aspetto e il testo del banner per personalizzare l'informativa breve in funzione del GDPR
Con l'introduzione di questo nuovo regolamento denominato GDPR ho timore che mi succeda quello che è avvenuto circa tre anni fa. Mi fusi il cervello per settimane per trovare una soluzione alla introduzione del banner per la Cookie Law e, il giorno della entrata in vigore della legge, Google implementò automaticamente i banner in tutti i siti sulla piattaforma Blogger.

Non mi stupirei se il 26 Maggio 2018 succedesse la stessa cosa, però non si può attendere fino a quel giorno senza provare a risolvere il problema da soli. Come ho già spiegato nei post precedenti dedicati a questo tema, gli utenti di Blogger possono solo modificare la informativa breve, la informativa lunga e aggiungere dei link a modulo di contatto, modulo dei commenti e al modulo di verifica della sottoscrizione della Newsletter.

In questo post vedremo appunto come personalizzare il testo della Informativa breve che si mostra in tutti i blog di Blogger quando si aprono per la prima volta o quando si aprono con una scheda in incognito. Nei blog con i vecchi Temi, anche quelli del tipo Dynamic View, il banner viene mostrato in alto. Invece nei nuovi Temi Responsive, il banner ufficiale di Blogger è posizionato nella parte bassa del layout.

Vediamo come modificare il Template per visualizzare una scritta che informi gli utenti anche della tutela della privacy derivante dal regolamento GDPR oltre che della accettazione o meno della politica dei cookie.





MODIFICA DEL TEMA DI BLOGGER


Prima di procedere, si deve andare su Tema -> Backup/Ripristino e salvare il Tema per ripristinarlo se le modifiche non andassero a buon fine. Si va poi su Tema -> Modifica HTML e si cerca la riga ]]></b:skin>.  Per mostrare il banner nella parte bassa, subito sopra a questa riga, si incolla il seguente codice

/* CSS Cookie e GDPR */
#cookieChoiceInfo {
top: auto !important; /* Banner in basso */
bottom: 0 !important; /* Banner in basso */
}

div#cookieChoiceInfo {
font-family: Georgia;
}

quindi si salva il template. Se il vostro banner è già posizionato nella parte bassa, non avete bisogno di incollare questo codice. La famiglia di font colorata di rosso può essere ovviamente personalizzata.






banner-gdpr

Aprendo una finestra di navigazione in Incognito, controllate che il banner venga effettivamente visualizzato nella parte bassa del layout. Adesso cercate la riga </head> e, subito sopra, incollate questo codice

<!-- Personalizzazione banner cookie e GDPR inizio-->
<b:if cond='!data:blog.isMobile'>
<!-- Banner Desktop -->
<style>
span.cookie-choices-text {font-size:14px !important; color: #fff !important;}
</style>
       <script type='text/javascript'>
cookieOptions = {msg: &quot;Questo sito su Blogger usa cookie Google e di altre terze parti per analizzare il traffico, per statistiche e pubblicità personalizzata. Navigando nel blog accetti l\47uso dei cookie e il trattamento dei dati secondo il GDPR.&quot;, close: &quot;OK Accetto&quot;, learn: &quot;+Informazioni&quot;, link:&quot;https://www.ideepercomputeredinternet.com/p/politica-dei-cookie.html&quot;};
</script>
     <b:else/>
<!-- Banner Mobile -->
     <style>
span.cookie-choices-text {font-size:11px !important; color:#fff !important;}
</style>
       <script type='text/javascript'>
cookieOptions = {msg: &quot;Questo sito su Blogger usa cookie Google e di altre terze parti per analizzare il traffico, per statistiche e pubblicità personalizzata. Navigando nel blog accetti l\47uso dei cookie e il trattamento dei dati secondo il GDPR.&quot;, close: &quot;OK&quot;, learn: &quot;+Info&quot;, link:&quot;https://www.ideepercomputeredinternet.com/p/politica-dei-cookie.html&quot;};
</script>
     </b:if>
<!-- Personalizzazione banner cookie e GDPR fine-->

quindi salvate il modello. Le personalizzazioni per l'aspetto del banner sono le seguenti:
  1. Il codice è suddiviso in due parti per la versione mobile e quella desktop. Si può modificare il testo colorato di blu per renderlo più sintetico nella versione mobile, così come i bottoni colorati di viola.
  2. La dimensione del testo, 14 pixel per il desktop e 11 pixel per il mobile
  3. Il colore del testo scelto #fff bianco per entrambe le versioni
  4. L'URL della Policy Privacy estesa da sostituire a quella di questo sito.
  5. Ho inserito un apostrofo con la regola l\47uso al posto di l'uso. Bisogna ricordarsi che il javascript interpreta l'apostrofo come parte del codice e non come testo. Evitare apostrofi e altri simboli speciali. 





Chi abbia un blog con gli ultimi modelli Responsive, può incollare, sempre sopra a </head>, questo codice

<!-- Personalizzazione banner cookie e GDPR inizio-->
  <style>
span.cookie-choices-text {font-size:12px !important; color: #fff !important;}
  </style>
        <script type='text/javascript'>
cookieOptions = {msg: &quot;Questo sito su Blogger usa cookie Google e di altre terze parti per analizzare il traffico, per statistiche e pubblicità personalizzata. Navigando nel blog accetti l\47uso dei cookie e il trattamento dei dati secondo il GDPR.&quot;, close: &quot;OK Accetto&quot;, learn: &quot;+Informazioni&quot;, link:&quot;https://www.ideepercomputeredinternet.com/p/politica-dei-cookie.html&quot;};
  </script>    
  <!-- Personalizzazione banner cookie e GDPR fine-->

più semplice, con le stesse personalizzazioni già viste in precedenza. Si può personalizzare ulteriormente l'aspetto del banner, nei colori e nei pulsanti, seguendo le istruzioni del post su come personalizzare il banner di Google. Nel prossimo articolo vedremo come aggiornare la Informativa Estesa ovvero la Policy Privacy.

AGGIORNAMENTO: Google ha implementato in modo nativo un nuovo Banner nei siti di Blogger. Leggere il post per apportare le necessarie modifiche al testo del banner da desktop e da mobile.
Tutte le info e i link sul GDPR li trovi in questo post e in quelli linkati in calce
GDPR per Blogger, come mettersi in regola


30 commenti :

  1. Ciao Ernesto, ma questo banner permette il blocco preventivo dei cookie?

    RispondiElimina
    Risposte
    1. Questo discorso è già stato affrontato tre anni fa e da allora nulla è cambiato. Per Blogger il banner e questo, punto
      @#

      Elimina
  2. Chi non ha la pubblicità sul blog non farebbe meglio ad aspettare? (Certo è che questi aggiornamenti dell'ultimo minuto non aiutano nessuno. Credo che la differenza tra wordpress e blogger si senta soprattutto in situazioni come queste).

    RispondiElimina
    Risposte
    1. Puoi aspettare benissimo, figurati se il 26 Maggio vengono a controllare il tuo sito, e poi chi dovrebbe venire a farlo? Non è chiaro e non c'è neppure una autorità preposta
      @#

      Elimina
  3. Ciao Ernesto io il banner adesso lo ho in alto :che devo fare?

    RispondiElimina
  4. Ho cambiato solo la scritta nell'informativa breve. Il resto già l'avevo inserito due anni fa.

    RispondiElimina
  5. Io per ora lascio tutto in mano a google, ma seguo gli aggiornamenti su questo sito. Tre anni fa stavo impazzendo con le diverse interpretazioni della cookie law e la quasi impossibilità di risolvere il problema (tanto che inizialmente ho tagliato tutti i servizi che prevedevano cookie di terze parti, per poi reintegrarli quando si è capito che di fatto non c'erano controlli). Al momento ho soltanto modificato l'informativa estesa. In un altro sito su altervista wordpress (dove la gestione del dominio personalizzato è pessima rispetto a quella di blogger) ho il plugin di Iubenda che mi pare aggiornato a queste nuove norme (e comunque non ci sono né forum né registrazioni varie).

    RispondiElimina
  6. Ciao, ho una domanda. Il mio è un sito blogspot appunto, senza dominio comprato. Appare già il banner dei cookie.. devo comunque inserirne un altro io o sarà google magari ad aggiornarlo?

    RispondiElimina
    Risposte
    1. Nessuno lo sa con certezza. Aspetta in 26 Maggio e controlla. Comunque la informativa estesa dovrai aggiornarla
      @#

      Elimina
  7. Ernesto ho sotituito il banner vecchio con questo ma non riesco a personalizzare il colore dello sfondo dello stesso come hai descritto nell'articolo che citi

    RispondiElimina
    Risposte
    1. Incolla questo codice

      div#cookieChoiceInfo {
      background-color: #000000 !important; /* Colore di sfondo con trasparenza */
      }

      prima della ultima riga della sezione / b:skin dove al posto di #000000 ci metti il codice del colore che vuoi. Il codice

      div#cookieChoiceInfo {
      background-color: rgba(28,201,181,0.95) !important;
      }

      era più carino perché inserisce anche la trasparenza. Però devi convertire il codice esadecimale HEX in codice RGB formato da una terna di numeri
      https://www.ideepercomputeredinternet.com/2018/01/hex-rgb-codici-lista-colori-italiano-tabella.htmlù
      https://www.ideepercomputeredinternet.com/2012/08/rgb-hex-convertire-codici-colori.html

      @#

      Elimina
    2. Grazie mille..provo come hai deto...ho provato a convertirlo ma rimane grigio...ti faccio sapere

      Elimina
  8. Grazie anche per questo post. Posso azzardare una domanda? con ads si possono impostare gli annunci non personalizzati di default ma pare che la conseguenza sarà un crollo delle già modeste entrate, frugando nelle pagine di supporto ho trovato i codici di configurazione per gli annunci personalizzati o meno in base al consenso. per me è arabo, parlano di un amp-consent come base di partenza e non so neanche cosa sia... forse il 25 imposterò gli annunci non personalizzati di default però magari qualcosa implementeranno anche per blogger... (

    RispondiElimina
    Risposte
    1. Ti copio incollo una frase del post linkato all'inizio:
      "Comunque niente panico perché le eventuali multe per la non conformità al GDPR non saranno immediate. Si inizierà con un avvertimento, poi con un rimprovero, quindi con una sospensione dell'elaborazione dei dati, e in caso di violazione continuata della norma, allora potrebbero arrivare le multe."

      Tanto per diminuire lo stress 😊
      Riguardo al tema degli annunci non personalizzati, possono essere impostati da Adsense. Possono essere impostati per un po' di tempo per monitorare le differenze di entrate. Vai su Consenti e Blocca Annunci -> Tutti i miei siti -> Consenso degli utenti UE. Lo puoi vedere anche da adesso andando su Rapporti avanzati -> Tipi di targeting e guardare la percentuale di Contestuale e Personalizzata
      @#

      Elimina
    2. grazie per la citazione antipanico, comunque ho appena dovuto aggiornare il pc, la microsoft ha trovato il modo di farmi spuntare le caselline spacciando per dati tecnici cose che a me non sembravano tali. Il 25 probabilmente spunterò il non personalizzato. continuo a seguire...

      Elimina
  9. come potrò sistemare l'infomrativa estesa dopo il 26 se ce ne sarà bisogno? grazie

    RispondiElimina
    Risposte
    1. Se ci saranno novità pubblicherò dei post di aggiornamento che potrai trovare in calce a questo articolo
      https://www.ideepercomputeredinternet.com/2018/05/gdpr-blogger.html
      @#

      Elimina
  10. Ciao Ernesto, magari la domanda te l'hanno già fatta. Io il banner l'ho inserito in passato non ricordo magari un paio di anni fa. Quindi posso lasciare tutto uguale e cambiare solo il riferimento alla normativa nuova? Voglio dire scrivere un nuovo post come quello che hai scritto in maniera esauriente tu (https://www.ideepercomputeredinternet.com/p/politica-dei-cookie.html) e fare riferimento a quello cambiando la URL all'interno del codice che avevo inserito? Tra l'altro è il codice che tu avevi opportunamente suggerito nel blog.
    Grazie mille e complimenti per la dedicazione e professionalità con cui tratti il tema.

    RispondiElimina
    Risposte
    1. Puoi semplicemente modificare la pagina della cookie law inserendo i nuovi riferimenti al GDPR senza scriverne una nuova e quindi senza cambiare URL del link. Serve anche cambiare pure qualcosa nel testo del banner, informativa breve, per aggiungere il riferimento alla privacy e al GDPR
      @#

      Elimina
  11. Buongiorno.Come faccio la modifica nelle "visualizzazione dinamica"? Grazie

    RispondiElimina
    Risposte
    1. Nello stesso modo. Cerchi il vecchio testo della informativa breve e lo sostituisci con uno nuovo più analitico che parli pure del GDPR poi salvi il Tema. Se il testo non lo avevi personalizzato incolli tutto il codice
      @#

      Elimina
  12. Ciao Ernesto, sto provando diverse volte a modificare il banner nativo di Google, premetto che ho una grafica acquista e di HTML non capisco nulla e, inoltre, non è un blog responsive, al momento il Banner nativo di Blogger è in alto, anche se inserisco il codice per inserirlo giù, resta sempre sopra, mi chiedevo se questo passaggio è facoltativo o no?
    Inoltre, s'è possibile vorrei chiedervi a che riga è " head " è, tramite la ricerca ctrl + f risulta alla 771 è quella o può essere anche un' altra? Un'ultima cosa, quando scrive " subito sopra", si riferisce alla riga precedente, alla 770, nel mio caso?


    Mi scusi per le varie domande futili, ma ho il timore di combinare pasticcio e perdere tutto il lavoro.
    Grazie

    RispondiElimina
    Risposte
    1. Mettere il banner in basso è facoltativo. Non c'è un numero di riga preciso per la riga </head> perché dipende dal modello e dalle personalizzazioni però ce n'è una soltanto e quindi non puoi sbagliare. Per incollare il codice inserisci il cursore prima di </head> quindi vai su Invio per creare uno spazio vuoto e solo allora incolli il codice in quello spazio
      @#

      Elimina
  13. Ciao Ernesto, ho copiato il tuo codice per mettere il mio banner. Grazie funziona benissimo.
    Mi sorge un altro problema. Volevole tenere quello di Google però se si clicca su ok, mi compare il codice html.
    Sul blog ufficiale mentre su quello di prova dove faccio i miei pasticci funziona bene. SEmpre blogger e sempre modello semplice. Dove sbaglio? Grazie!!!!

    }
    /* CSS Cookie e GDPR */
    #cookieChoiceInfo {
    top: auto !important; /* Banner in basso */
    bottom: 0 !important; /* Banner in basso */
    }
    div#cookieChoiceInfo {
    font-family: Georgia;
    }
    /* CSS Cookie e GDPR Google */
    #cookieChoiceInfo {
    top: 0 !important; /* Banner in alto */
    bottom: auto !important; /* Banner in alto */
    }
    div#cookieChoiceInfo {
    font-family: Georgia;
    }
    ]]>

    RispondiElimina
    Risposte
    1. Dimenticavo... ho aggiunto se non ho fatto cavolate ma ripeto sul clone del blog funziona, la seconda parte per metter il blog più in basso.
      Cime mai su quello ufficiale no funge????? Io capisco na cippa :) scusa ahahahah

      Elimina
    2. Significa che probabilmente nel blog ufficiale hai copiato male il codice :)
      @#

      Elimina
    3. Non riesco a copiarlo mi resta nero come questo commento non diventa blu come il resto.
      O ho problemi col pc...

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy