[JS] Script Ley Europea Cookies en Blogger

[el-brujo]

Deshabilitar Cookies en Blogger

Editar Plantilla HTML:

Después del Title (o sea que esté en el head)

Código (javascript) [Seleccionar] Expandir

<SCRIPT>
cookieChoices = {};
</SCRIPT>


Añadir script de Google:

http://www.cookiechoices.org/cookiechoices.zip

Dentro del zip hay el fichero cookiechoices.js

Añadir después de la siguiente línea:

Código (javascript) [Seleccionar] Expandir

document.getElementById(dismissLinkId).onclick = _dismissLinkClick;

esto para que al hacer scroll desaparezca el aviso (consideramos que si está navegando acepta nuestra política de Cookies, navegar = scroll).

Código (javascript) [Seleccionar] Expandir

document.onscroll = _dismissLinkClick;

La cookie caduca por defecto en 1 año:

Podemos poner + 3 años:

Código (javascript) [Seleccionar] Expandir

expiryDate.setFullYear(expiryDate.getFullYear() + 3);

Y añadir el "path=/" para que no aparezca el aviso en todas las páginas del dominio:

Código (javascript) [Seleccionar] Expandir

document.cookie = cookieName + '=y; path=/; expires=' + expiryDate.toGMTString();

O otra opción es colocar la cookie en culaquier subdominio de .elhacker.net, es decir *.elhacker.net , de manera que si el nombre de la cookie (displayCookieConsent) y el valor es "y" y la acepta en un subdominio sirve para el resto de los dominios.

Código (javascript) [Seleccionar] Expandir

document.cookie=cookieName+'=y; expires='+expiryDate.toGMTString()+'; domain='+getDomainName(window.location.host)+'; path=/';

Debemos añadir la función  getDomainName en el fichero cookiechoices.js

Código (javascript) [Seleccionar] Expandir

/*
function getDomainName(hostName){if(hostName.lastIndexOf(".")==hostName.indexOf(".")){return hostName}return hostName.substring(hostName.indexOf(".")+1)}
*/

function getDomainName(hostName)
{return hostName.substring(hostName.lastIndexOf(".",hostName.lastIndexOf(".")-1)+1);}


Y cambiamos el nombre de la variable cookieChoices por cookieOpciones

Ahora ponemos el código en la plantilla de nuestro sitio web dentro del body (no en el head)

Código (html4strict) [Seleccionar] Expandir

<script src="//www.elhacker.net/inclusiones/plantillas/006/cookiechoices.js"></script>
<script>
 document.addEventListener('DOMContentLoaded', function(event) {
   cookieOpciones.showCookieConsentBar('Este sitio web utiliza cookies propias y de terceros. Si continúas navegando, consideramos que aceptas su uso.',
                                      'Vale', 'Más info', 'http://www.elhacker.net/legal.html');
 });
</script>

Podemos cambiar el texto del aviso de Cookies, y el texto de más información y el del ok, o Entendido o Vale, De Acuerdo, etc.

El js de blogger por defecto es:

Código (javascript) [Seleccionar] Expandir

<!-- 'Tú eres el responsable de informar a los visitantes de tu blog de las cookies que utilizas en él. Para más información, ve a http://www.blogger.com/go/cookiechoices.' -->
<script src="/js/cookiechoices.js" defer></script>
<script>
 document.addEventListener('DOMContentLoaded', function(event) {
   window.cookieChoices && cookieChoices.showCookieConsentBar && cookieChoices.showCookieConsentBar(
       (window.cookieOptions && cookieOptions.msg) || 'Este sitio emplea cookies de Google para prestar sus servicios, para personalizar anuncios y para analizar el tráfico. Google recibe información sobre tu uso de este sitio web. Si utilizas este sitio web, se sobreentiende que aceptas el uso de cookies.',
       (window.cookieOptions && cookieOptions.close) || 'Entendido',
       (window.cookieOptions && cookieOptions.learn) || 'Más información',
       (window.cookieOptions && cookieOptions.link) || 'https://www.blogger.com/go/blogspot-cookies');
 });
</script>


Para cambiar el texto:

Código (javascript) [Seleccionar] Expandir

<script>
cookieOptions = {msg: "Este sitio web utiliza cookies propias y de terceros. Si continúas navegando, consideramos que aceptas su uso", close: "Vale", learn: "Más info", link:"http://www.elhacker.net/legal.html"};
</script>


Para modificar  la apariencia: style:

Código (css) [Seleccionar] Expandir

<b:skin><![CDATA[

#cookieChoiceInfo {
position:absolute !important;
width:40% !important;
background-color:#eee !important;
left:38% !important;
color: #333 !important;
font-size: 10px !important;
font-weight:normal !important;
padding:4px !important;
margin:0; !important;
z-index:1000 !important;
line-height:1% !important;
}      


Para cumplir la ley debemos esperar a que el usuario acepte las cookies antes de cargarlas:

Código (javascript) [Seleccionar] Expandir

<script>
function carga_cookies(){
 (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
 (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
 m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
 })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

 ga('create', 'UA-xxxxxxx', 'auto');
 ga('send', 'pageview');
}
</script>

Y una vez acepte las cookies llamamos a la función:

Código (javascript) [Seleccionar] Expandir

carga_cookies();


Google Analytics sin recoger datos de país (cookie técnica)

https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#anonymizeIp

https://github.com/ItalyCookieChoices/italy-cookie-choices/wiki/Analytics-and-Cookie-Law

Código (javascript) [Seleccionar] Expandir

<script>
 (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
 (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
 m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
 })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

 ga('create', 'UA-XXXXXXX-X',  {'siteSpeedSampleRate': 100, 'anonymizeIp': true, 'storage': 'none', 'clientId': window.localStorage.getItem('ga_clientId')});
 ga(function(tracker) {
   window.localStorage.setItem('ga_clientId', tracker.get('clientId'));
 });
 ga('send', 'pageview');

</script>

Otra opción más completa es usar jquery:

Código (html4strict) [Seleccionar] Expandir

<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/jquery.cookie.js"></script>
<script src="js/jquery.cookiecuttr.js"></script>

En el cookiecuttr.js cambiar el texto, link info cookies,

Código (javascript) [Seleccionar] Expandir

cookieMessage:
cookiePolicyLink:

Y cargar en el <body>

Código (javascript) [Seleccionar] Expandir

<script>
$(document).ready(function () {
$.cookieCuttr();
$( window ).scroll(function() {
if (jQuery.cookie('cc_cookie_accept') == undefined) {
 $( ".cc-cookie-accept" ).click();
}
});
$( window ).click(function() {
if (jQuery.cookie('cc_cookie_accept') == undefined) {
 $( ".cc-cookie-accept" ).click();
}
});
});
</script>

Otra opción interesante es un script que cumple con la ley con Google Adsense y Google Analytics:

https://github.com/ecoal95/CookieTool/blob/master/src/cookietool.js

http://emiliocobos.net/script-ley-de-cookies/
http://emiliocobos.net/ley-de-cookies-y-adsense/