Questo è l'avviso apparso a tutti nella sezione Panoramica dal pannello di amministrazione di Blogger:
Potrebbe sembrare una buona notizia ma chi ha già utilizzato un metodo diverso per aggiungere la barra dei cookie manualmente, si è trovato ad avere due barre per il consenso dei cookie. Questo significa che una delle due va tolta; mi sento di suggerire di lasciare quella di Google perché si può ugualmente personalizzare come quella utilizzata in precedenza, quindi dell'altra dovrete eliminare sia il codice dello script sia il codice css delle personalizzazioni.
Per personalizzare la barra dei cookie ufficiale per Blogger dovete andare su Modello > Modifica HTML e poi cercare il tag </head> (da non confondere con <head>) e prima di esso dovrete andare ad aggiungere il seguente codice:
<script type='text/javascript'>
cookieOptions = {msg: "Questo sito usa i cookie di terze parti per migliorare i servizi e analizzare il traffico. Navigando nel blog accetti l'uso dei cookie.", close: "OK", learn: "+Informazioni", link:"http://www.scuolissima.com/2012/11/disclaimer-scuolissimacom.html"};
</script>
Questo codice vi permetterà di modificare la dicitura della barra, le parole contenute nei due pulsanti e il link dell'informativa estesa. Per impostazione predefinita Blogger inserisce la sua pagina dei cookie, ma dato che molti utilizzano cookie di terze parti come quelli di Facebook e Twitter, è consigliato sostituire il link predefinito con quello della propria Privacy/Policy.
Personalizzazioni
La barra ufficiale dei cookie introdotta da Google si può facilmente personalizzare utilizzando il css. Questo è il codice css che ho utilizzato per la mia barra, va copiato prima del tag ]]></b:skin> del modello, sentitevi liberi di copiarlo e/o modificarlo:
/* CSS Barra dei Cookie */
div#cookieChoiceInfo {
background-color: #3399FF !important;
color:#FFF !important;
min-height: 20px;
font-weight:bold;
font-size:14px;
font-family: Georgia;
}
#cookieChoiceInfo > a:nth-child(2),a#cookieChoiceDismiss,#cookieChoiceInfo > div > a:nth-child(2) {
color: #eee;
background-color:#FF8000 !important;
text-align:center;
padding:3px 12px;
text-decoration:none;
border-radius:8px;
font-family:Georgia;
font-size:14px;
font-weight:bold;
}
#cookieChoiceInfo > a:nth-child(2):hover, a#cookieChoiceDismiss:hover,#cookieChoiceInfo > div > a:nth-child(2):hover {
color:#fff !important;
text-decoration:none !important;
position: relative;
top:1px;
left:1px;
}
.cookie-choices-button { background-color:#FF8000 !important; border-radius: 10px 10px 10px 10px;
}
.cookie-choices-text {color: white !important;}
Dopo aver completato questi semplici passaggi, il risultato finale della barra dovrà essere il seguente:
background-color: #3399FF !important; -----> è il colore azzurro della barra.
color: white !important; -----> è il colore bianco di tutte le scritte.
background-color:#FF8000 !important; -----> è il colore arancione dei due pulsanti.
Come spostare la barra in basso
Per spostare la barra nella parte inferiore dello schermo dovete modificare il codice css riportato sopra. Ovvero subito dopo /* CSS Barra dei Cookie */ dovrete aggiungere il seguente codice:
#cookieChoiceInfo {
top: auto !important;
bottom: 0 !important;}
Cercate di renderla ben visibile la barra, ad esempio se il vostro tema dovesse possedere uno sfondo nero, dovreste evitare di impostare il colore nero come sfondo della barra. Anche le scritte contenute dentro la barra dovranno essere ben leggibili. Se avete dei dubbi potete benissimo non inserire il codice css e lasciare la barra coi colori predefiniti, ovvero di colore grigio-nero.
Grazie a te per l'ennesimo aiuto ..... invece di aiutare Blogger/Google stà mettendo sempre più il bastone tra le ruote a noi poveri gestori di blog
RispondiEliminaCon questa è la seconda volta che devo cambiare tutto .....
Speriamo che non gli venga in mente di cambiare altro - Ora dovrei essere a posto grazie ancora per il tuo grande aiuto
Un saluto buna serata e migliore settimana in corso
P.S. Buona estate e Buone Vacanze ......
Si, infatti non se ne può più! La combinazione caldo afoso + cookie è micidiale :-)
EliminaHe he he lo puoi dire ad alta voce ..... puoi anche gridarlo Andrea ..... è davvero una combinazione micidiale ;-)
RispondiEliminaBuona settimana :-)
Grazie, mi hai "salvato" come del resto anche con la precedente edizione del banner
RispondiEliminaIl codice html funziona ma quelli css per modificarne l'aspetto no...:-( come fare? Ho seguito tutte le procedure correttamente. Grazie!
RispondiEliminaVero, me ne sono accorto anche io. Di recente Google ha aggiornato lo stile predefinito della barra rendendo inutili tutte le personalizzazioni precedenti. Comunque adesso ho sostituito il codice css, che poi è lo stesso che sto usando su Scuolissima, e quindi dovrebbe funzionare.
Eliminanon riesco ad avere la visualizzazio\ne corretta della barra, come devo fare?
RispondiEliminail tuo blog non lo conosco e quindi non posso sapere a cosa ti riferisci. Un consiglio generico ed alla cieca è quello di rimuovere i css della vecchia barra, di spostarla in basso o di cambiare tema...
EliminaCiao, guida utilissima, grazie per i consigli e la gentilezza con cui ti prodighi a rispondere ai commenti! Ti disturbo anch'io perché non riesco a far funzionare il css per la personalizzazione... l'ho inserito ma non vedo nessun cambiamento.
RispondiEliminaFacendo un ispezione con Chrome sul modello del tuo blog riesco a vedere due lunghi css che iniziano con "CSS Barra dei Cookie". Quello messo in posizione sbagliata va tolto perché non fa funzionare l'altro.
EliminaCiao Andrea, utilissima la tua guida..io sono riuscito a modificare il banner ufficiale di google con la dicitura che ci hai proposto ma vorrei sapere come cambiare il collegamento + informazioni perché mi riporta sempre alla pagina iniziale del blog..come faccio a modificare il collegamento? TI prego aiutami perché non ci capisco una mazza..grazie a priori
RispondiEliminaDal primo codice di questa guida dovrai sostituire il link della mia informativa con la tua informativa personale... è facile distinguerlo perché è colorato di rosso. Il testo che invece sei riuscito a modificare è quello di colore blu.
EliminaAh perfetto..adesso ho capito cosa intendevi..problema risolto..ti ringrazio tanto!!!
RispondiEliminac'è invece un modo per poter risalire a tutti i cookie presenti nel mio blog e che magari io disconosco? Premetto che ho un blog d'informazione e le uniche cose che pubblico sono articoli di testo o video che possono provenire: da youtube, facebook o dailymotion...altre piattaforme molto difficilmente.
RispondiEliminasi tramite Chrome si possono vedere i cookie di ogni sito:
Eliminahttp://www.scuolissima.com/2015/05/conoscere-cookie-sito.html
Ciao, avevo la barra predefinita e un po' invadente di Google.Con la personalizzazione si ristretta leggermente, ma non sono riuscita ne a mettere la barra sotto, e nemmeno cambiare i colori della stessa ... e pensare che ho seguito con calma tutti i tuoi suggerimenti:
RispondiEliminaprobabilmente hai posizionato il css in un posto sbagliato, controlla se è posizionato come descritto nel primo metodo in questo link:
Eliminahttp://www.scuolissima.com/2014/08/come-aggiungere-codice-css-blogger.html
Sono entrata in CSS e da lì funziona; la barra rimane cmq sopra, ma mi piace anche così.
EliminaIntanto ti ringrazio molto per la tua gentilezza!
L'ultimo codice serve per posizionare la barra in basso.
EliminaCiao,
RispondiEliminaposso chiedederti perchè, il tasto "+Informazioni" viene visualizzato più squadrato del tasto "OK" che appare più arrotondato?
Grazie.
Ho aggiornato il codice, adesso se lo sostituisci con quello vecchio lo vedrai arrotondato.
EliminaCiao Andrea,fino a ieri questo tuo codice funzionava senza problemi sul mio blog. Da stamattina è scomparso il banner e non c'è verso di reinserirlo. Anche se copio i codici di nuovo, non funziona nulla. Sai cosa può dipendere?
RispondiEliminaÈ stato un problema temporaneo dello script di Google, evidentemente avranno fatto qualche aggiornamento.
EliminaAndrea ho applicato come da te descritto il codice, tutto ok. Posso sapere come posso cambiare la grandezza del banner da renderlo più visibile? Quali sono i codici che posso cambiare? Grazie Libera
RispondiEliminaDovrebbe bastare l'aggiunta di questo codice css:
Elimina#cookieChoiceInfo {padding: 14px !important;}
Dimenticavo. Dove va incollato il codice? :-)
Eliminasubito dopo il css di questo articolo. Se non sai come fare segui questa guida:
Eliminahttp://www.scuolissima.com/2014/08/come-aggiungere-codice-css-blogger.html