Google, che era il principale interessato alla nuova direttiva Europea, aveva avuto 18 mesi di tempo per adeguare i propri siti. Ovviamente Google, di tempo ne ha impiegato molto meno e in più,ha messo a disposizione dei webmaster due strumenti per aiutarli ad adeguare i loro siti in maniera semplice e veloce. La prima soluzione, prevede una “finestra di dialogo” (Dialog Box) che appare al visitatore prima di lasciare spazio alle pagine del sito web. La seconda soluzione invece, sovrappone un banner in basso o in alto nelle pagine in cui viene inserito lo script. In entrambe le soluzioni quando il visitatore clicca sul pulsante “Accetta” o “Chiudi” (possiamo scegliere liberamente il testo del pulsante), verrà generato un cookie dalla durata di 12 mesi permettendo al visitatore per un anno di non dover chiudere nuovamente il banner o la finestra.
Per prima cosa, dovete creare sul vostro sito una pagina dedicata alla cookie policy. Potete prendere spunto da qui.
Quindi se scegliete la prima soluzione e cioè visualizzare una finestra col messaggio, bisogna inserire il seguente codice all’interno del tag <body> delle pagine del vostro sito:
<scriptsrc="/cookiechoices.js"></script><script>//<![CDATA[
document.addEventListener('DOMContentLoaded',function(event){
cookieChoices.showCookieConsentDialog('Il tuo messaggio per i visitatori.',
'Chiudi','Maggiori Informazioni',
'http://indirizzo_pagina_cookie_policy'>);
});//]]></script>
Copiate infine sul server, nella cartella principale del vostro sito il file cookiechoices.js (vi riporto di seguito il link dove scaricarlo) e assicuratevi che il percorso coincida con quello inserito nella prima riga del codice indicato sopra. Modificare inoltre l’indirizzo ‘http://indirizzo_pagina_cookie_policy’ inserendo l’indirizzo della pagina dedicata alla cookie policy che avete creato in precedenza.
Scarica cookiechoices.zip (prima di copiarlo sul server va scompattato!)
Se scegliete la soluzione del banner, il codice da inserire nelle pagine del vostro sito, all’interno della sezione <body> è quello riportato di seguito.
<scriptsrc="/cookiechoices.js"></script><script>//<![CDATA[
document.addEventListener('DOMContentLoaded',function(event){
cookieChoices.showCookieConsentBar('Il tuo messaggio per i visitarori.',
'Chiudi','Maggiori Informazioni',
'http://indirizzo_pagina_cookie_policy'>);
});//]]></script>
Anche in questo caso, bisogna caricare sul server il file cookiechoices.js e inserire l’indirizzo corretto della vostra pagina dedicata all’uso dei cookie.
Scarica cookiechoices.zip (prima di copiarlo sul server va scompattato!)
Per chi usa blogspot, o non può caricare il file sul server, può sostituire la riga:
<scriptsrc="/cookiechoices.js"></script>
con :
<scripttype="text/javascript">//<![CDATA[(function(window){
if(!!window.cookieChoices){
return window.cookieChoices;
}
var document = window.document;
// IE8 does not support textContent, so we should fallback to innerText.
var supportsTextContent ='textContent' in document.body;
var cookieChoices =(function(){
var cookieName ='displayCookieConsent';
var cookieConsentId ='cookieChoiceInfo';
var dismissLinkId ='cookieChoiceDismiss';
function _createHeaderElement(cookieText, dismissText, linkText, linkHref){
var butterBarStyles ='position:fixed;width:100%;background-color:#eee;'+
'margin:0; left:0; top:0;padding:4px;z-index:1000;text-align:center;';
var cookieConsentElement = document.createElement('div');
cookieConsentElement.id = cookieConsentId;
cookieConsentElement.style.cssText = butterBarStyles;
cookieConsentElement.appendChild(_createConsentText(cookieText));
if(!!linkText &&!!linkHref){
cookieConsentElement.appendChild(_createInformationLink(linkText, linkHref));
}
cookieConsentElement.appendChild(_createDismissLink(dismissText));
return cookieConsentElement;
}
function _createDialogElement(cookieText, dismissText, linkText, linkHref){
var glassStyle ='position:fixed;width:100%;height:100%;z-index:999;'+
'top:0;left:0;opacity:0.5;filter:alpha(opacity=50);'+
'background-color:#ccc;';
var dialogStyle ='z-index:1000;position:fixed;left:50%;top:50%';
var contentStyle ='position:relative;left:-50%;margin-top:-25%;'+
'background-color:#fff;padding:20px;box-shadow:4px 4px 25px #888;';
var cookieConsentElement = document.createElement('div');
cookieConsentElement.id = cookieConsentId;
var glassPanel = document.createElement('div');
glassPanel.style.cssText = glassStyle;
var content = document.createElement('div');
content.style.cssText = contentStyle;
var dialog = document.createElement('div');
dialog.style.cssText = dialogStyle;
var dismissLink = _createDismissLink(dismissText);
dismissLink.style.display ='block';
dismissLink.style.textAlign ='right';
dismissLink.style.marginTop ='8px';
content.appendChild(_createConsentText(cookieText));
if(!!linkText &&!!linkHref){
content.appendChild(_createInformationLink(linkText, linkHref));
}
content.appendChild(dismissLink);
dialog.appendChild(content);
cookieConsentElement.appendChild(glassPanel);
cookieConsentElement.appendChild(dialog);
return cookieConsentElement;
}
function _setElementText(element, text){
if(supportsTextContent){
element.textContent = text;
}else{
element.innerText = text;
}
}
function _createConsentText(cookieText){
var consentText = document.createElement('span');
_setElementText(consentText, cookieText);
return consentText;
}
function _createDismissLink(dismissText){
var dismissLink = document.createElement('a');
_setElementText(dismissLink, dismissText);
dismissLink.id = dismissLinkId;
dismissLink.href ='#';
dismissLink.style.marginLeft ='24px';
return dismissLink;
}
function _createInformationLink(linkText, linkHref){
var infoLink = document.createElement('a');
_setElementText(infoLink, linkText);
infoLink.href = linkHref;
infoLink.target ='_blank';
infoLink.style.marginLeft ='8px';
return infoLink;
}
function _dismissLinkClick(){
_saveUserPreference();
_removeCookieConsent();
returnfalse;
}
function _showCookieConsent(cookieText, dismissText, linkText, linkHref, isDialog){
if(_shouldDisplayConsent()){
_removeCookieConsent();
var consentElement =(isDialog)?
_createDialogElement(cookieText, dismissText, linkText, linkHref):
_createHeaderElement(cookieText, dismissText, linkText, linkHref);
var fragment = document.createDocumentFragment();
fragment.appendChild(consentElement);
document.body.appendChild(fragment.cloneNode(true));
document.getElementById(dismissLinkId).onclick = _dismissLinkClick;
}
}
function showCookieConsentBar(cookieText, dismissText, linkText, linkHref){
_showCookieConsent(cookieText, dismissText, linkText, linkHref,false);
}
function showCookieConsentDialog(cookieText, dismissText, linkText, linkHref){
_showCookieConsent(cookieText, dismissText, linkText, linkHref,true);
}
function _removeCookieConsent(){
var cookieChoiceElement = document.getElementById(cookieConsentId);
if(cookieChoiceElement !=null){
cookieChoiceElement.parentNode.removeChild(cookieChoiceElement);
}
}
function _saveUserPreference(){
// Set the cookie expiry to one year after today.
var expiryDate =newDate();
expiryDate.setFullYear(expiryDate.getFullYear()+1);
document.cookie = cookieName +'=y; expires='+ expiryDate.toGMTString();
}
function _shouldDisplayConsent(){
// Display the header only if the cookie has not been set.
return!document.cookie.match(newRegExp(cookieName +'=([^;]+)'));
}
var exports ={};
exports.showCookieConsentBar = showCookieConsentBar;
exports.showCookieConsentDialog = showCookieConsentDialog;
return exports;
})();
window.cookieChoices = cookieChoices;
return cookieChoices;})(this);//]]> </script>
Non vi resta che personalizzare il messaggio da visualizzare per i vostri visitatori che potrebbe essere del tipo:
Questo sito utilizza i cookie per migliorare servizi e esperienza dei lettori.
Se decidi di continuare la navigazione consideriamo che accetti il loro uso.
Autore:
Posted by Mario Difrancesco 
dalla quale è ad esempio possibile regolare la larghezza del pulsante (Button Width), l’opacità/trasparenza (Button Opacity), l’azione che deve eseguire una volta cliccato ovvero minimizzare le finestre aperte per visualizzare il Desktop oppure passare subito al Desktop senza minimizzare (Toggle Desktop e Minimize Windows). Consiglio di attivare l’opzione “Run Application on Windows Startup”