Pubblicato il 20/08/15 - aggiornato il  | 98 commenti :

Nuova personalizzazione del banner dei cookie su Blogger.

Come personalizzare il banner per i cookie di Blogger nei colori del testo, dello sfondo, nella famiglia dei caratteri e nella loro dimensione il banner di Google inserito in tutti i blog di Blogger.
Che ci siano state delle modifiche nel codice di Blogger me ne sono accorto da tanti piccoli problemi che ho avuto in questi giorni. Innanzitutto era sparita la Descrizione della Ricerca nell'Editor del post e quindi sono dovuto tornare su Impostazioni > Preferenze di Ricerca per reimpostarla.

Poi ho constatato alcuni piccoli cambiamenti del layout a cui ho dovuto porre rimedio. Un'altra modifica non troppo evidente è stata quella apportata al banner di Google che si visualizza in tutti i siti di Blogger. Sono stati modificati alcuni selettori degli elementi quindi il codice per la personalizzazione che avevo pubblicato qualche settimana fa non va più bene. Un bottone non è più colorato come dovrebbe, il testo non si riesce a modificarlo di colore e altre cosucce varie. Visivamente è stata introdotta una larghezza massima per il testo del banner che è stata fissata a 800 pixel. In questo modo il testo stesso è divenuto molto più centrale.

Vediamo come si possa nuovamente personalizzare il banner sia per desktop sia per mobile. Ovviamente si deve salvare il template quindi andare su Modello > Modifica HTML, cliccare sulla freccetta nera a sinistra della sezione <b:skin> intorno alla 13-esima riga, cercare con Ctrl+F l'altra riga ]]></b:skin> e, subito sopra a questa, incollare questo codice

/* CSS Accettazione Cookie */
#cookieChoiceInfo {
top: auto !important; /* Banner in basso */
bottom: 0 !important; /* Banner in basso */
}
div#cookieChoiceInfo {
background-color: rgba(28,201,181,0.95) !important; /* Colore di sfondo con trasparenza */
font-weight:bold; /* Grassetto */
font-family: Georgia; /* Famiglia di caratteri */
}
#cookieChoiceInfo > a:nth-child(2),a#cookieChoiceDismiss, span.cookie-choices-buttons > a:nth-child(1), #cookieChoiceInfo > div > a:nth-child(2) {
color: #eee; /* Colore del testo dei bottoni */
background:linear-gradient(to bottom, #fedede 4%, #e50909 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fedede', endColorstr='#e50909',GradientType=0); /* Colore di sfondo dei bottoni */
box-shadow: 2px 2px 2px  #aaa; /* Ombreggiatura */
text-shadow:1px 1px 1px #ccc;
text-align:center;
padding:3px 8px;
text-decoration:none;
border-radius:8px;
font-family:Georgia; /* Famiglia di Caratteri */
font-size:13px; /* Dimensione font bottoni */
font-weight:bold;
}
#cookieChoiceInfo > a:nth-child(2):hover, a#cookieChoiceDismiss:hover, span.cookie-choices-buttons > a:nth-child(1):hover, #cookieChoiceInfo > div > a:nth-child(2):hover {
color:#fff; /* Colore testo bottoni al passaggio del mouse */
box-shadow: 1px 1px 1px  #aaa; /* Ombreggiatura */
text-shadow:0px 0px 0px #ccc;
position: relative;
top:1px; /* Effetto schiacciamento bottoni */
left:1px;
}

I parametri da personalizzare sono stati colorati di rosso e il loro significato è indicato da dei commenti colorati di verde. Successivamente si cerca la riga </head> e, subito sopra, si incolla

<!-- Personalizzazione cookie inizio-->
<b:if cond='!data:blog.isMobile'>
<!-- Banner Desktop -->
<style>
span.cookie-choices-text {font-size:13px !important; color: #fff !important; /* Colore del testo del messaggio */ max-width:900px !important; /* Larghezza testo */}
</style>
      <script type='text/javascript'>
cookieOptions = {msg: &quot;Questo sito usa i cookie di terze parti per migliorare i servizi e analizzare il traffico. Le info sulla tua navigazione sono condivise con queste terze parti. Navigando nel blog accetti l\47uso dei cookie.&quot;, close: &quot;OK Accetto&quot;, learn: &quot;+Informazioni&quot;, link:&quot;https://goo.gl/wuWQ2h&quot;};
</script>
    <b:else/>
<!-- Banner Mobile -->
    <style>
span.cookie-choices-text {font-size:11px !important; color:#f00 !important; /* Colore del testo del messaggio */}
</style>
      <script type='text/javascript'>
cookieOptions = {msg: &quot;Questo sito usa i cookie di terze parti con cui sono condivise le info su di te. Navigando nel blog accetti la nostra politica dei cookie.&quot;, close: &quot;OK&quot;, learn: &quot;+Info&quot;, link:&quot;http://www.ideepercomputeredinternet.com/p/politica-dei-cookie.html&quot;};
</script>
    </b:if>
<!-- Personalizzazione cookie fine-->

quindi si salva il modello. Ci sono due diverse personalizzazioni per desktop e mobile che possono essere modificate separatamente. Si possono anche cambiare separatamente altri aspetti ma mi sono limitato ad aumentare a 900 pixel la larghezza massima del banner per il desktop e a settare dimensioni e colori diversi per il testo del messaggio. Anche quest'ultimo però ha una differenziazione, più lungo per il desktop e più corto per il mobile così come per il testo visibile nei bottoni. Ho anche linkato due diverse Cookie Policy. Se avevate già utilizzato il codice precedente per la personalizzazione del banner di Blogger non dovete fare altro che sostituirlo dopo aver modificato i parametri.

banner-mobile-desktop-blogger

Lo screenshot del banner per il mobile del blog di test l'ho preso con Screenfly.


98 commenti :

  1. Ciao, avevo inserito il banner precedente, ma per cambiarlo vorrei cancellare prima il codice vecchio, solo che non so più dove inizia e dove finisce... Come posso fare? Inoltre, ho visto che google ha modificato il suo, e adesso ogni volta che apro il blog li ho doppi (anche dopo aver dato l'ok a codice preso nel tuo vecchio post). Secondo te non basta quello di google?
    Grazie

    RispondiElimina
    Risposte
    1. Il codice lo hai copiato da questo sito? Se è così io ci metto sempre delle stringhe esplicative per ritrovarlo facilmente. Ho visto il codice sorgente i questo sito
      http://gattosandro-viaggiatore.blogspot.it/
      che credo sia il tuo. Devi cancellare il codice a partire da questa riga
      -- Accettazione Cookie - Inizio --
      fino alla riga
      -- Accettazione Cookie - Fine --

      Quindi vedi cancellare il codice da
      -- Script dei cookie --
      fino a
      -- Accettazione Cookie - Fine --
      Non ho messo i segni < e > perché altrimenti non mi salva il commento ma nelle righe ci sono anche quelli. Prima di procedere salva comunque il modello
      @#

      Elimina
    2. Ok grazie mille! Sei sempre gentilissimo.

      Elimina
  2. ciao
    ho "personalizzato" il messaggio di google senza discriminare se desktop o mobile e mentre su desktop funziona se visualizzo il blog da cellulare continuo a vedere il messaggio di "default" di google.
    ho anche provato a duplicare la "personalizzazione" condizionanzola al test "<b:if cond='data:blog.isMobile" etc
    ma niente da smartphone continuo a vedere il solito messaggio
    hai qualche suggerimento ?
    grazie

    RispondiElimina
    Risposte
    1. Dal comportamento può essere che tu non abbia scelto "Personalizza" su Modello > Cellulare > Ruota dentata tra i modelli per il mobile
      @#

      Elimina
    2. ho modificato come suggerito e funziona
      grazie

      ps
      ma in quel caso cosa avrei dovuto fare ? bastava testare se: data:blog.isMobile ?

      Elimina
    3. Le modifiche applicate al codice del modello nel mobile funzionano solo se si è scelto il modello Personalizza per il Cellulare
      @#

      Elimina
  3. Ciao, Ernesto,
    ho copiato il tuo nuovo codice per provare se con questo riuscivo a far sparire il banner cliccando su OK Accetto. Non so se ricordi ma con l'altro codice si era presentato il problema. In un primo momento sembrava risolto ma si era poi ripresentato, il banner non scompariva più al clic sull'ok. E allo stesso modo con questo nuovo codice. Non scompare! Ho provato anche da tablet, stessa cosa. (da cellulare non ho provato ma non mi interessa più di tanto per ora).
    Posso fare qualcosa?
    ti ringrazio,
    g

    RispondiElimina
    Risposte
    1. Il tuo blog è questo?
      http://matematicamedie.blogspot.it/
      Ho cliccato su OK e il banner è sparito. Ho ricaricato la pagina e il banner non è ricomparso. È chiaro che se tu apri il blog con una pagina in Incognito il banner appare perché non rileva il cookie di accettazione. Ho provato anche con il tool Screenfly per il mobile ed è tutto OK. Forse non ti è chiaro che il banner non si mostra più solo quando si apre il sito con un browser che abbia già archiviato il cookie con l'accettazione
      @#

      Elimina
    2. Sì il blog è quello.
      Grazie per aver provato e sono contenta che sia tutto ok.
      Però non capisco: il mio problema non è che il banner appaia, sia in incognito che no, ma che non scompaia quando clicco sull'ok. Come ad esempio è successo qui da te. La prima volta che ho visto il tuo nuovo banner, è scomparso al clic su Ok accetto e ora, evidentemente, come tu dici, archiviato il cookie con accettazione, non compare più. Da me, booh.
      Comunque, mi va bene che almeno non crei noie ai visitatori :-)
      grazie tantissime,
      io riproverò...
      g

      Elimina
  4. Ernesto, il tuo precedente codice sul mio blog continua a funzionare. E' cambiato il layout, nel senso che, come hai scritto tu, il testo è più centrato e i pulsanti, a seconda della risoluzione dello schermo e dello zoom, sono o centrati in basso o a destra del testo. Ma il colore di sfondo e quello dei pulsanti sono rimasti. Il colore del testo è bianco e non lo posso modificare, ma bianco a me va benissimo. Quello che ha scritto Giovanna mi fa preoccupare, nel senso che non vorrei che non "funziona" il pulsante di accettazione, anche se ho verificato cancellando i cookies dal browser e il banner ricompare. Se e quando ti è possibile potresti verificare anche tu? Grazie mille.

    RispondiElimina
    Risposte
    1. Credo che Giovanna non avesse ben compreso il funzionamento del banner. Il tuo sito è questo
      http://vascocomevivere.blogspot.it/
      e il bottone funziona come su tutti i siti
      @#

      Elimina
    2. Sì, il blog è quello. Ti ringrazio infinitamente per la tua disponibilità :)

      Elimina
  5. Ciao! E' da un po' che ti seguo e ho notato una cosa: ogni volta che entro in un tuo articolo per la prima volta mi esce nuovamente il banner di accettazione cookie, nonostante abbia cliccato OK ormai diverse volte. Siccome io stessa ho usato il tuo codice nel mio blog, c'è chi mi ha fatto notare la stessa cosa, ossia che il banner appunto si riapre nel momento in cui si entra in una pagina. Ma non dovrebbe non apparire più una volta dato l'OK, se non altro per un anno? Altrimenti c'è un modo per farlo sparire una volta accettato? Temo che potrebbe dare fastidio ai visitatori. Grazie

    RispondiElimina
    Risposte
    1. Dopo aver cliccato su Ok Accetto lo vedi sempre il banner? Credo di no. La ragione per cui ti appare più volte non dipende da questo sito ma da altre considerazioni che ti elenco
      1) Hai aperto il post del sito con un browser diverso da quello dell'ultima volta
      2) Hai cancellato i dati di navigazione del browser
      3) Hai usato CCleaner o altro software analogo per eliminare i dati superflui
      4) Credi di aver cliccato su OK ma non lo hai fatto
      @#

      Elimina
  6. Io non so perché ma non mi modifica la scritta: nonostante io modifichi la stringa e salvi l modello, il messaggio resta scritto così come l'hai impostato tu (intendo proprio le parole, non le personalizzazioni).

    RispondiElimina
    Risposte
    1. Tra l'altro questa cosa mi succede solo per la versione desktop e ho notato che non compare il tuo messaggio (quello che hai scritto adesso) ma uno che forse hai implementato in un precedente modello, ossia: Questo sito si serve dell'utilizzo dei cookie di Google per l'erogazione dei servizi, la personalizzazione degli annunci e l'analisi del traffico. Le informazioni sul tuo utilizzo del sito sono condivise con Google. Se prosegui la navigazione acconsenti all'utilizzo dei cookie (o è la scritta ufficiale di blogger? In ogni caso non ha molto senso, no? Non posso cambiarla in qualche modo?)

      Elimina
    2. Questo significa che nel modello hai ancora delle porzioni di codice che ti sei dimenticata di togliere quando hai messo il nuovo. Per controllare vai su Modello ecerca le espressioni che leggi nel banner in modo da trovare il codice in cui sono state inserite
      @#

      Elimina
    3. No, non c'è nulla (e lo so perché sono tornata al modello pre-implementazione del banner). Strano che la modifica funzioni soltanto per la versione mobile, no?

      Elimina
    4. Infatti la scritta non è la mia ma quella di Google. Non funziona la tua scritta. Torna nel modello e guarda il colore. Spesso si capisce anche da quello che non va se è di due diversi colori
      @#

      Elimina
  7. Ciao Ernesto,
    è possibile posizionare il banner dei cookie (in mobile) qualche pixel più in alto del fondo? Invece che "bottom", qualcosa tipo "bottom + 20pixel".
    Questo perché in fondo ho dei pulsanti social che vanno sopra il banner cookie.
    Grazie

    RispondiElimina
    Risposte
    1. Mi era stato già chiesto. Non escludo che possa essere fatto ma non ho trovato la soluzione :(
      @#

      Elimina
    2. Peccato :)
      Magari sposto i tasti social in alto. Grazie comunque per le innumerevoli dritte su Blogger!

      Elimina
    3. Ciao, ancora due domande:
      1) in questa versione quale porzione di codice si deve modificare per far apparire il banner cookie in alto, "top" (sempre in mobile)?
      2) tornando al discorso precedente, per far apparire il banner cookie (bottom) qualche pixel più in alto, sarebbe possibile inserire delle righe vuote (ad esempio con < / br >) dopo i pulsanti di "ok" e "info"

      Grazie ancora

      Elimina
    4. Per il banner in alto solo nel mobile devi aggiungere questo codice

      #cookieChoiceInfo {
      top: 0 !important;
      bottom: auto !important;
      }
      prima di
      span.cookie-choices-text {font-size:11px !important; color:#f00 !important; /* Colore del testo del messaggio */

      Per il resto della domanda prova con < br/ > ma non vedo come potrebbe funzionare :)
      @#

      Elimina
    5. Grazie per l'aggiunta di codice.
      Per il punto 2 era solo un'idea da profano in materia, pensavo che aggiungendo righe vuote sotto i pulsanti, il tutto si sarebbe spostato verso l'alto, lasciando quello spazio vuoto utile per far restare i pulsanti social che avevo. Comunque non saprei dove inserirli i < br/ > :)

      Elimina
  8. qual'è la riga di codice da modificare per cambiare il colore del banner, intendo il verdino acqua o celeste.. tutto il banner.. i bottoni rossi e le scritte in bianco mi vanno bene, Grazie Ernesto, in attesa di risposta ... :-)

    RispondiElimina
    Risposte
    1. C'era già scritto accanto
      background-color: rgba(28,201,181,0.95) !important; /* Colore di sfondo con trasparenza */
      Se non sai trattare il codice RGB al posto di quello HEX leggiti questo post
      http://www.ideepercomputeredinternet.com/2015/06/hex-rgb-converer-codice-colori-html.html
      @#

      Elimina
  9. Ciao scusami il disturbo ma sono davvero disperata, è tutto il pomeriggio che cerco di mettere un banner ma non so come mai non mi appare mai ;( ho copiato tutto identico come scritto sopra nelle tue indicazioni ma non riesco proprio a farlo comparire tu sai come posso fare?? Dove sbaglio?? Grazie mille il mio blog è questo http://denimakeup95.blogspot.it/

    RispondiElimina
    Risposte
    1. Funziona perfettamente. Devi solo sostituire l'indirizzo della mia Pagina della Policy Cookie con la tua. Incolla questo link nel browser
      http://i.imgur.com/VW7gu28.png
      Il banner non lo vedi perché devi aprire il tuo sito con Modalità in Incognito o con Navigazione Anonima perché viene mostrato ovviamente solo a chi entra per la prima volta nel sito per non essere troppo invasivo
      @#

      Elimina
    2. Ciao grazie mille per la risposta sei sempre gentilissimo, ho provato con la finestra in incognito e vedo il banner predefinito di google e non quello con la mia privacy, eppure ho modificato solo i link ma non spunta ;(

      Elimina
    3. Funziona perfettamente. Apri questo link
      http://i.imgur.com/wCqnZ5I.png
      Solo che non devi linkare la policy privacy di Google ma devi creare una pagina statica con questo stile
      http://www.ideepercomputeredinternet.com/p/politica-dei-cookie.html
      che puoi prendere come modello. Funziona anche da dispositivi mobili come puoi vedere da questo screenshot
      http://i.imgur.com/oLoXvxc.png
      fatto con un emulatore di un tablet
      @#

      Elimina
    4. Ho modificato e messo la mia privacy policy ma esce sempre quella di google quando io dal mio html ho inserito la mia ;(

      Elimina
    5. Quando ho guardato dopo il commento precedente il banner funzionava adesso invece non funziona. Pare che tu abbia tolto tutto il codice della personalizzazione. Rimane quello ufficiale di Google che cmq potrebbe anche bastare
      @#

      Elimina
    6. Ho riprovato e rimesso tutto ma dalla mia anteprima quando modifico html esce il mio link giusto mentre quando lo guardo in incognito esce la dicitura di google ;(

      Elimina
    7. @# È probabile che tu abbia sbagliato a copiare il link. Prova a sostituire completamente questa parte di codice
      cookieOptions = {msg: "Questo sito usa i cookie di terze parti per migliorare i servizi e analizzare il traffico. Le info sulla tua navigazione sono condivise con queste terze parti. Navigando nel blog accetti l\47uso dei cookie.", close: "OK Accetto", learn: "+Informazioni", link:"http://goo.gl/C7gVM0;};

      con quest'altra

      cookieOptions = {msg: "Questo sito usa i cookie di terze parti con cui sono condivise le info su di te. Navigando nel blog accetti la nostra politica dei cookie.", close: "OK", learn: "+Info", link:"http://denimakeup95.blogspot.it/p/policy-privacy.html"};

      Elimina
    8. Nel tuo codice mancano le virgolette finali dopo l'indirizzo accorciato con Goo.gl. C'è
      link:"http://goo.gl/C7gVM0;};
      invece di
      link:"http://denimakeup95.blogspot.it/p/policy-privacy.html"};
      @#

      Elimina
    9. Grazie ora funziona:) sono davvero contenta, ti ho fatto una piccola donazione per avermi aiutata. So che non è molto ma spero sia apprezzata

      Elimina
  10. Questo commento è stato eliminato dall'autore.

    RispondiElimina
    Risposte
    1. Il tuo sito è questo?
      http://storiearitmocardiaco.blogspot.it/
      In effetti non compare nulla. È strano. Prova a togliere tutti i codici dei banner. Dovrebbe vedersi almeno quello ufficiale di Google. Altro non ti so dire mi spiace :(
      @#

      Elimina
  11. Questo commento è stato eliminato dall'autore.

    RispondiElimina
    Risposte
    1. Ah sì è quello! Vai su impostazioni -> Di Base -> HTTPS -> Reindirizzamento HTTPS e metti NO al passaggio a HTTPS quindi salva
      @#

      Elimina
  12. E' possibile avere il banner di google, semplicemente sotto anziché sopra?

    RispondiElimina
    Risposte
    1. Certo. Basta lasciare solo questo codice
      #cookieChoiceInfo {
      top: auto !important; /* Banner in basso */
      bottom: 0 !important; /* Banner in basso */
      }

      @#

      Elimina
    2. Grazie mille!
      Se invece volessi mettere il tuo, per avere sia il testo che i bottoni tutti a sinistra visto che ho un banner sulla destra, come potrei fare?

      Elimina
    3. Magari lo lascio così com'è e utilizzo la proprietà index per avere l'elemento sopra ogni cosa

      Elimina
    4. Il mio banner è quello di Google personalizzato nel testo, nei colori e nella posizione. Per spostare il testo a sinistra prova a mettere
      text-align:left; margin-right:500px;
      subito dopo
      span.cookie-choices-text {

      Per spostare a sinistra i bottoni prova con il codice
      float:left;
      subito dopo
      #cookieChoiceInfo > a:nth-child(2),a#cookieChoiceDismiss, span.cookie-choices-buttons > a:nth-child(1), #cookieChoiceInfo > div > a:nth-child(2) {

      P.S. Non ho testato e non posso garantire nulla
      @#

      Elimina
    5. Ho provato ad inserire solo quel tuo pezzettino di codice per averlo in basso ma il codice mi appare in ogni post. :(

      Elimina
    6. Il codice del commento 13.a funziona perfettamente se incollato correttamente prima della ultima riga della sezione b:skin. Ho dei dubbi su quello del 13.d
      @#

      Elimina
    7. Ma di funzionare funziona assolutamente, quello che intendo è che anche se si clicca ok, il banner continua ad esserci in ogni post.

      Elimina
  13. Non dipende da quel codice. Cambia solo la posizione. In alcuni blog si nota una persistenza del banner di Google che non è stata ancora risolta

    RispondiElimina
  14. Ciao Ernesto,

    avevo inserito questo tuo codice nel mio blog e funzionava perfettamente...ora ho dovuto reimportare una vecchia versione del template per risolvere altri problemi, così dopo averlo fatto ho reinserito e ripersonalizzato il codice che hai illustrato in questo articolo, ma questa volta non vedo il banner. Riesci a capire dov'è il problema? Ho controllato il codice fino a farmi venire gli occhi storti ma non vedo errori...Grazie in anticipo!

    RispondiElimina
    Risposte
    1. Non hai seguito questo post ma uno precedente. Il tuo blog è questo?
      http://offbeat-ya.blogspot.it/
      Vedo che hai nel modello anche lo script di Google che non è più necessario. Il codice del tuo sito si trova qui
      http://offbeat-ya.blogspot.com/js/cookiechoices.js
      quindi quello presente nel template cancellalo tutto. Il banner lo vedrai di nuovo aprendo una pagina in incognito. Poi utilizza questo post per eventualmente personalizzarlo
      @#

      Elimina
  15. Prima di tutto, grazie per la velocità - e sì, il mio blog è http://offbeat-ya.blogspot.it/.

    Tuttavia, scusa ma non ho chiara la situazione...tu dici che nel modello ho un vecchio codice tuo, più quello di Google, ma non quello che hai proposto in questo post. In effetti ho scorso tutto l'HTML e ho trovato parte del vecchio codice (che evidentemente mi era sfuggita), così l'ho eliminato. Ma il codice che hai descritto qui ce l'ho...nell'HTML lo vedo alle righe 1270 e seg. e 1377 e seg. Mentre il codice di Google non mi risulta. Se ti riferisci a http://offbeat-ya.blogspot.com/js/cookiechoices.js, io quei contenuti non li vedo da nessuna parte...(...tra l'altro quel link mi si è aperto solo in Chrome, mentre Firefox lo ignorava).

    Ad ogni modo, ora vedo il banner della mia cookie policy se apro una finestra anonima in Chrome, ma in Firefox e IE non lo vedo (mentre prima sì). Quindi abbiamo fatto un primo passo avanti, ma spero che tu riesca ancora ad aiutarmi...o a spiegarmi cosa non ho capito ;). Grazie!

    RispondiElimina
    Risposte
    1. Tutti i blog su Blogger hanno il codice del banner in un file esterno che si trova aggiungendo una stringa al dominio. Nel tuo caso si trova qui
      http://offbeat-ya.blogspot.com/js/cookiechoices.js
      Prova a aprire questa pagina che è nel tuo dominio e che contiene il codice del banner. Se nel modello c'è un ulteriore codice si possono creare delle incompatibilità quindi meglio eliminare tutto il codice non necessario. Poi si passa alla personalizzazione seguendo questo post
      @#

      Elimina
    2. Il codice del mio banner si trova qui
      http://www.ideepercomputeredinternet.com/js/cookiechoices.js
      ed è identico al tuo e a tutti gli altri blog su Blogger ma è leggermente diverso a quello precedente Spero di essere stato chiaro
      @#

      Elimina
  16. ---(Credevo di aver postato un commento ma è sparito. Mi scuso in anticipo nel caso dovresse ricomparire e ci riprovo...)---

    Scusa, forse sono un po' "densa", ma non ho capito. Cercherò di spiegarmi meglio...

    1) Ho tolto tutto il codice che avevi proposto in questo post, e ora vedo di nuovo il banner originale di Google, ma solo se apro una finestra anonima in Chrome - negli altri browser niente. Cioè la stessa cosa che succedeva con il banner che avevo creato seguendo le indicazioni di questo post. Non ha molto senso...non capisco il motivo.

    2) Tu dici che dovrei personalizzare il codice che trovo in http://offbeat-ya.blogspot.com/js/cookiechoices.js - ho capito bene? Ma non mi sembra che si possa personalizzare più di tanto, nel senso che non vedo una stringa dove inserire il link alla mia cookie policy personale...E in ogni caso non ho capito dove dovrei inserirlo una volta personalizzato...

    3) Se questo post è ancora online presumo che lo script da te proposto qui funzioni ancora, quindi non ho capito perché non posso più usarlo...in effetti, quando ho provato a rimetterlo, almeno su Chrome vedevo il banner personalizzato...Non c'è modo di farlo funzionare anche sugli altri browser? A parte il lato estetico, la mia necessità di personalizzare il più possibile deriva dal fatto che ho il blog in inglese, quindi non posso tenere la policy in italiano...

    Non so se mi sono spiegata...sono abbastanza confusa ;).

    RispondiElimina
    Risposte
    1. Concordo sul fatto che sei confusa :)
      Cercherò di essere ancora più chiaro
      1) Il banner dei cookie si vede anche su Firefox come puoi controllare da questa immagine
      http://i.imgur.com/SB0zovr.png
      Per vederlo è chiaro che dvi aprire il tuo sito con una scheda in incognito andando su Menù Finestra Anonima.
      2) Su Blogger è stato inserito il banner di default per tutti i siti con uno script comune caricato con un file nel dominio di tutti i blog. Questo non significa che non possa essere personalizzato.
      Rispetto alla situazione precedente non si mette nel modello di Blogger tutto il javascript ma si può aggiungere del CSS per modificare l'aspetto e un breve javascript per modificare il testo del banner, il testo dei bottoni e il link alla informativa estesa.
      3) In questo post rispetto ai precedenti manca il javascript completo visto che si utilizza quello ufficiale di Blogger ma è stato presentato un codice di esempio per eventualmente modificare l'aspetto, testo e link.
      4) Se vuoi modificare l'aspetto aggiungi nel Tema il primo codice di questo post modificando i codici dei colori. Se vuoi portare il banner in basso bastano le prime 5 righe.
      5) È però necessario almeno cambiare il link della Informativa di Google con quella nostra. Per far questo devi usare il secondo codice con cui personalizzare il testo, il link e i bottoni. Ovviamente devi sostituire i link alla mia Cookie Policy con la tua. Si può usare anche un testo diverso e diverse dimensioni per mobile e desktop.
      Se non mi sono fatto capire neppure questa volta rinuncio. Comunque è tutto spiegato in questo post che forse non hai avuto il tempo di leggere
      @#

      Elimina
    2. Il testo lo puoi scrivere naturalmente anche in inglese senza però usare apostrofi, virgolette o caratteri speciali (lo si potrebbe fare ma la spiegazione sarebbe troppo lunga)
      @#

      Elimina
  17. ---(OK, ogni volta che clicco su "Rispondi" il messaggio non viene pubblicato. Ci riprovo con un commento ex novo)---

    Scusa, ma questo post non solo l'ho letto, ma ormai l'ho quasi imparato a memoria. Solo che a volte il problema è nella capacità di farsi capire da parte di chi spiega, non solo e non sempre in una carenza da parte di chi chiede spiegazioni. Il codice da te qui descritto l'ho usato per un anno, e tutto funzionava perfettamente. Poi ho provato a reinstallare una vecchia versione del template per risolvere un altro problema senza però riuscirci, finché ho scoperto che un tuo vecchio codice (quello per bypassare i frame di Bloglovin' ecc.) interferiva con il resto dell'HTML. Quindi l'ho tolto, ma nel frattempo avevo perso la personalizzazione del banner dei cookies, così ho creato il codice da capo, di nuovo seguendo le tue istruzioni in questo post. Solo che questa volta riuscivo a vedere il banner solo su Chrome (in modalità anonima), mentre prima lo vedevo tranquillamente anche in Firefox e senza bisogno di anonimato. La stessa cosa succede ora che ho rimosso la personalizzazione e sono tornata al banner nativo di Google - lo vedo solo con Chrome (in anonimo), e non mi spiego il perché. Tu mi hai mostrato che riesci a vederlo tranquillamente, ma né io con Firefox versione 54.01 (OVVIAMENTE in finestra anonima), né mio marito dal suo posto di lavoro con Firefox versione 51.01 lo vediamo. Ora, io non pretendo che tu possa risolvere questo problema o darne una spiegazione, però mi chiedo se altre persone non sono in grado di vederlo e se rischio una multa per questo. E' l'unica cosa che mi preoccupa...
    Non sono arrabbiata perché non ho risolto il mio problema di cui sopra (il banner "invisibile") grazie a te, ci mancherebbe. Non sei certo obbligato ad avere spiegazioni o soluzioni per tutto - oltretutto per te questo è un hobby, non un lavoro. Ma per un "divulgatore informatico" (anche se per hobby) non sei sempre molto chiaro, e soprattutto, dispiace che tu presuma l'ignoranza o la pigrizia da parte di chi ti legge. Ovviamente io non sono un'esperta di codici o non sarei qui a chiederti aiuto, però credo di essere capace di comprendere una spiegazione se mi viene data con sufficiente chiarezza. E soprattutto, prima di fare domande leggo con la maggiore attenzione possibile quanto è già stato scritto. Sinceramente, quel commento sul post che non avrei avuto il tempo di leggere potevi risparmiartelo...Detto questo, buona serata e grazie comunque...

    RispondiElimina
  18. 1) Se ti sei sentita offesa non era certo mia intenzione. Mi dispiace. Ho la presunzione di essere anche troppo gentile e disponibile senza chiedere nulla in cambio. Merce rara di questi tempi.
    2) Con il sorgente pagina riesco a vedere quello che c'è nel tuo modello anche senza accedere alla tua Bacheca e ho visto il codice del vecchio JavaScript che probabilmente hai copiato da un vecchio post.
    3) Ripeto che per risolvere devi oersonalizzarlo seguendo questo post.
    4) Solo una modifica e assolutamente necessaria ed è quella di sostituire il link della informativa estesa di Google
    5) Il tuo banner se si vede con il mio Firefox, scheda di navigazione anonima, si vede con tutti i Firefox, certamente con quelli di chi si mettesse a controllare il tuo sito, ipotesi improbabile. Forse il Firefox con cui hai aperto il sito sono mesi che non viene aggiornato.
    @#

    RispondiElimina
  19. OK, riproviamo con calma...dovrò essere necessariamente prolissa ;).

    Intanto ho scoperto perché sui due Firefox non riuscivo a vedere il banner: in entrambi era attivata l'opzione "I don't care about cookies" (che mio marito si era dimenticato di aver impostato). Infatti ora se la disabilito il mio banner lo vedo, ma su IE non compare neanche adesso. Il codice è esattamente quello da te descritto in questo post. Prima di questo avevo usato un vecchio codice (quello a cui ti riferisci a inizio articolo), ma scorrendo l'HTML non riesco a trovarne traccia. Ho però aperto il codice sorgente del mio blog ed ho trovato un'incongruenza. Questo è ciò che vedo nel mio HTML (ovvero il codice che hai illustrato in questo post, ovviamente personalizzato):


    RIGA 1270 e seg.: CSS Accettazione Cookie (come nel tuo articolo, solo personalizzato)


    RIGA 1377 e seg:

    <!-- Personalizzazione cookie inizio-->
    <b:if cond='!data:blog.isMobile'>
    <!-- Banner Desktop -->
    <style>
    span.cookie-choices-text {font-size:14px !important; color: #376905 !important; /* Colore del testo del messaggio */ max-width:900px !important; /* Larghezza testo */}
    </style>
    <script type='text/javascript'>
    cookieOptions = {msg: &quot;Offbeat YA uses Google cookies. By browsing the site you are agreeing to our use of them.&quot;, close: &quot;OK&quot;, learn: &quot;Info&quot;, link:&quot;http://offbeat-ya.blogspot.it/p/privacy-policy.html&quot;};
    </script>
    <b:else/>
    <!-- Banner Mobile -->
    <style>
    span.cookie-choices-text {font-size:11px !important; color:#376905 !important; /* Colore del testo del messaggio */}
    </style>
    <script type='text/javascript'>
    cookieOptions = {msg: &quot;Offbeat YA uses Google cookies. By browsing the site you are agreeing to our use of them.&quot;, close: &quot;OK&quot;, learn: &quot;Info&quot;, link:&quot;http://offbeat-ya.blogspot.it/p/privacy-policy.html.html&quot;};
    </script>
    </b:if>
    <!-- Personalizzazione cookie fine-->


    Se invece vado sul codice sorgente, al posto della seconda parte trovo:


    RIGA 1362:

    <!-- Personalizzazione cookie inizio-->
    <!-- Banner Desktop -->
    <style>
    span.cookie-choices-text {font-size:14px !important; color: #376905 !important; /* Colore del testo del messaggio */ max-width:900px !important; /* Larghezza testo */}
    </style>
    <script type='text/javascript'>
    cookieOptions = {msg: "Offbeat YA uses Google cookies. By browsing the site you are agreeing to our use of them.", close: "OK", learn: "Info", link:"http://offbeat-ya.blogspot.it/p/privacy-policy.html"};
    </script>
    <!-- Personalizzazione cookie fine-->


    Quindi ora capisco perché mi dicevi che avevo un vecchio Javascript, ma il problema è che nell'HTML non vedo quello, ma il nuovo! quindi non so come eliminarlo.

    Ora, come ripeto, anche così su Firefox e Chrome vedo il banner senza problemi, ma su Internet Explorer niente. Ho aperto il tuo blog su IE per una verifica, e ho constatato che il tuo banner è visibile, anche se eredita i colori nativi di Google. Quindi il mio problema è far apparire il banner su IE, anche se non personalizzato, ma presumo che per farlo io debba cancellare quel vecchio Javascript che nell'HTML non trovo. Come è possibile? Devo rivolgermi al supporto di Google forum? o tu conosci una soluzione?

    RispondiElimina
    Risposte
    1. Ha poco senso testare il blog su IE visto che la Microsoft ha ritirato il supporto e non lo aggiorna più. Su Microsoft Edge il banner funziona
      http://i.imgur.com/VSmkvxe.png
      Anche il collegamento alla Policy Cookie è giusto quindi lascia tutto così
      @#

      Elimina
    2. Grazie, mi hai tolto un bel mal di testa. Purché non mi multino (cosa che ritengo comunque improbabile) va tutto bene...anche se l'incongruenza nei codici è davvero strana.

      Elimina
    3. Non è strana. È normale :)
      Il Tema di Blogger è in XML e alcuni tag come < o > o " devono essere convertite nelle rispettive Entità
      http://www.ideepercomputeredinternet.com/2017/02/codice-html-commenti-blogger.html
      E questo vale anche per i tag specifici di Blogger
      http://www.ideepercomputeredinternet.com/2016/02/blogger-tag-layout-widget.html
      che nel modello vengono visualizzati con la variabile mentre nel codice sorgente con il risultato generato dai server di Blogger. Per esempio data:blog.title è uguale per tutti i modelli ma nel sorgente pagina ciascuno vedrà il titolo del proprio sito
      @#

      Elimina
  20. Ciao, perdonami ma come sposto il banner in basso, come appare in questa tua pagina?

    RispondiElimina
  21. Basta questo codice

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

    @#

    RispondiElimina
    Risposte
    1. Lo avevo già copiato dal tuo post ma niente... mi appare in alto. Cosa c'è che non va?

      Elimina
    2. Non lo so. Quel codice funziona di sicuro. Forse lo hai incollato male lasciando una parentesi graffa insieme alla riga

      ]]></b:skin>

      È un errore abbastanza comune
      @#

      Elimina
  22. Salve Ernesto, posso lasciare la pagina informativa di Google o è obbligatorio crearne una personalizzata?

    RispondiElimina
  23. Se oltre a Google hai altri cookie tipo Facebook, devi crearla specifica per il sito
    @#

    RispondiElimina
  24. Ciao! sono arrivata qui in cerca di un codice funzionante per inserire l' avviso di cookie nel blog, ma una volta inserito nell' html, salvato e caricato nuovamente la home, non viene visualizzato niente! Ho un layout personalizzato e non riesco a capire dove sbaglio. Per caso sai suggerirmi come rimediare? grazie in anticipo!

    RispondiElimina
    Risposte
    1. Non sono un veggente e non conosco neppure l'URL del tuo blog 🙂. L'errore più comune è quello di non aprire il blog con una scheda in incognito, altro errore è quello di modificare il messaggio prima di incollarlo invece di farlo successivamente
      @#

      Elimina
    2. ok! scusa non ho usato la mia url perchè ho letto di non inserire link nei commenti... comunque l' indirizzo è questo www.valeriaolistica.com
      Ho il dominio personalizzato ma gestisco il blog da blogger e prima di cambiate template, l' avviso dei cookie funzionava! Mi sembra di aver seguito alla lettera le tue indicazioni, ho ricontrollato, ma niente!

      Elimina
    3. Nel messaggio c'è scritto di non inserire link cliccabili ma URL non cliccabili si possono incollare 🙂.
      Il banner funziona benissimo
      https://i.imgur.com/XRHtgfe.jpg
      Come ti ho già detto devi aprire una pagina del tuo sito con una scheda in incognito altrimenti il banner non lo vedi altrimenti lo vedresti tutte le volte che apri il tuo sito
      @#

      Elimina
    4. Ok perfetto! grazie mille sei stato gentilissimo. Ho aperto scheda in incognito e appare, solo che facendo la prova e cliccando sul bottone informazioni, si apre una pagina di errore. Ho provato sia da pc che da iphone e si apre sempre la pagina 404 di google. Nel primo link dell' informativa ho lasciato questo usato da te www.//goo.gl/wuWQ2h (non me lo apre neanche se lo copio nella barra degli indirizzi) e nel secondo ho messo il mio personale http://www.valeriaolistica.com/2018/02/politica-dei-cookie-di-questo-sito-in_16.html?zx=45a63390a2642770. Come posso risolvere? Vorrei stare tranquilla, che funzioni tutto al 100 per cento perchè non vorrei prendere nessuna multa! Grazie se puoi aiutarmi, un saluto!

      Elimina
    5. Il tuo blog è aperto ai soli lettori invitati quindi il problema non esiste. Gli indirizzi che hai inserito per la policy sono entrambi errati.
      L'unico giusto sarebbe questo
      http://www.valeriaolistica.com/2018/02/politica-dei-cookie-di-questo-sito-in_16.html
      ammesso che apra una pagina. La parte eccedente, cioè la stringa ?zx=45a63390a2642770 non so dove l'hai trovata, probabilmente hai un widget che ti traccia il sito. Se l'URL precedente si apre, incollalo sia nella versione mobile sia in quella desktop. Dopo che hai incollato gli indirzzi controlla che non sia rimasto uno spazio prima o dopo le virgolette "
      @#

      Elimina
    6. Si in effetti avevo cambiato la privacy in attesa di risolvere questo problema e adesso grazie ai tuoi preziosi consigli ho risolto, posso di nuovo mettere pubblica la pagina. Grazie tante, senza di te non sò come avrei fatto, sei stato gentilissimo, domattina appena arrivo a lavoro ricambierò inviandoti una donazione, anche se piccola, spero tu gradisca. Un saluto!

      Elimina
  25. Ciao Ernesto, ti volevo chiedere come possiamo adeguarci alla nuova normativa gdpr che entrerà in vigore il 25 maggio. Io ho usato le tue indicazioni, ma con questo abbiamo il blocco preventivo dei cookie?

    RispondiElimina
    Risposte
    1. A breve pubblicherò un post sul tema. Se però nel nostro sito non ci sono moduli di registrazione, le azioni da compiere non dovrebbero essere molte. Credo che basterà aggiornare l'informativa estesa già creata per i cookie
      P.S. Mi pare che la data sia il 18 Maggio ma potrei sbagliare 😊
      @#

      Elimina
  26. Ho letto che la data è il 25 maggio in alcuni siti, ma non so se sia corretto. Comunque aspetterò il tuo nuovo articolo è grazie sempre per le risposte tempestive 😉😊

    RispondiElimina
  27. Ma se voglio modificare lo sfondo in bianco e la scritta in nero cosa devo modificare precisamente? Perché quando vado a modificare mi da do nuovo lo sfondo grigio e i caratteri in bianco

    RispondiElimina
  28. @# Sostituisci questa riga
    background-color: rgba(28,201,181,0.95) !important; /* Colore di sfondo con trasparenza */

    con queste altre due

    background-color:#fff !important;
    color:#000 !important;


    RispondiElimina
  29. ho modificato il file js con questa stringa:
    function _createHeaderElement(cookieText, dismissText, linkText, linkHref) {
    var butterBarStyles = ‘position:fixed;width:100%;background-color:#eee;’ +
    ‘margin:0; left:0; bottom:0;padding:4px;z-index:1000;text-align:center;’;

    ma non funziona… il banner rimane in alto… cos’è che sbaglio?

    RispondiElimina
    Risposte
    1. @# Non devi modificare lo script per mettere il banner in basso. Basta aggiungere questo codice

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

      subito sopra alla riga

      ]]></b:skin>

      nel Tema di Blogger

      Elimina
  30. ok perdonami... credo proprio che io stia facendo tutt'altra cosa...

    nel file .css e nel file .js non ci sta la riga ]]>

    io devo modificare il banner di un sito...

    RispondiElimina
    Risposte
    1. Infatti. Non devi modificare il codice dei file ma il Tema di Blogger ammesso che tu usi questa piattaforma. Se usi Wordpress ovviamente la situazione è molto diversa e questo articolo non ti serve. Se usi Blogger devi andare nella Bacheca -> Tema -> Modifica HTML e aggiungere il codice del commento 30.a nella posizione indicata
      @#

      Elimina
    2. Ricordati di salvare il modello prima di modificarlo
      @#

      Elimina
  31. Ciao a luglio sono state emanate nuove linee guida sui cookie, la modifica più importante e quella di creare un'area dove l'utente può selezionare o deselezionare i cookie che vuole o non vuole, come facciamo noi su piattaforma Blogger? Servirebbe una delle tue guide stupende!
    E magari poter far tutto con il banner originale di Google!?
    ti lascio il link della info non cliccabile; www.ninjamarketing.it/2021/08/24/nuove-linee-guida-sui-cookie-garante-privacy/
    ( tra l'altro se l'utente chiude con la X in alto destra il banner significa rifiuto dei cookie , e quindi non devono essere installati... )
    Come facciamo?

    RispondiElimina
    Risposte
    1. Al momento non si può fare nulla di più di quello che è stato già fatto. Si potrebbe sottoscrivere un abbonamento a uno dei servizi a pagamento però funzionerebbe completamente solo per i Temi Responsive mentre per gli altri Temi non funzionerebbe nella versione mobile. Speriamo che Google aggiorni il suo banner ufficiale.
      @#

      Elimina
    2. Ciao,
      per chi utilizza AdSense, è attivo anche in Italia già da diverso tempo il nuovo banner perfettamente in regola con tutte le ultime normative, come è stato comunicato a suo tempo a tutti i publisher. Basta attivarlo dalle Impostazioni di AdSense e disabilitare la visualizzazione del banner di Blogger (assolutamente non in regola con il GDPR). Siti grandi e piccoli di ogni nazionalità utilizzano il banner di AdSense che è completo ed in regola con tutte le diverse e più recenti normative internazionali. Per attivarlo, basta recarsi (nel proprio profilo AdSense) in Annunci > Per sito > Modifica (icona a matita) > Altre funzionalità > Messaggio per il consenso GDPR. Se attendete che Google si ricordi che esiste anche Blogger, una volta ogni 5 anni, state freschi!🤣

      Elimina
    3. Grazie della info. Non ci avevo fatto caso
      @#

      Elimina
    4. Questo commento è stato eliminato dall'autore.

      Elimina
  32. Grazie della risposta, speriamo davvero che google faccia qualcosa... ho guardato sul "googleblog" Italia ma nessun accenno al problema, Boh!? menomale che ho letto quella news, stavo per aprire un blog su piattaforma Blogger con dominio personalizzato , speriamo che intervengano in fretta... impossibile che non facciano nulla..

    RispondiElimina
    Risposte
    1. Non mi porrei troppi problemi su questo punto. Non mi risulta che utenti di Blogger siano mai stati multati per inosservanza del GDPR e della Cookie Law.
      @#

      Elimina
  33. Ciao, in vita della nuova normativa hai creato qualcosa di aggiornato per rifutare i cookies? Grazie mille

    RispondiElimina
    Risposte
    1. Chi ha Adsense cioè chi monetizza il blog con Adsense può utilizzare il loro banner automatico che è perfettamente in regola
      https://www.ideepercomputeredinternet.com/2021/09/gdpr-blogger-adsense.html
      Comunque penso che anche il banner precedente può andar bene.
      @#

      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