He desarrollado un pequeño script para poder cumplir la ley de cookies, que es apto para todos los servicios. Toda la información y demás está en Github, haré un artículo más grande para que cualquiera pueda usarlo ya use blogger, wordpress o cualquier otro CMS.

Raciona automáticamente las cookies de Analytics y Adsense, pero es sencillo añadir otros servicios de terceros sin tocar el código, posee una API de eventos para poder añadir esos scripts asíncronamente.

Demo Descarga Ver en GitHub

Características

  • Carga automática de Google Analytics y Google Adsense si son usados
  • API de eventos para facilitar la carga de cualquier script que cargue cookies
  • Sección de opciones

Instalación

Paso 1: Añadir el script

Lo primero será añadir el script y los estilos necesarios. Los estilos son algo muy básico símplemente para asegurar que el mensaje sea visible y podéis modificarlos a vuestro gusto. Los links que veréis aquí están hosteados en github, pero lo ideal sería que cada uno guardase una copia y lo hosteara.

Encima de </head>:

<link rel="stylesheet" type="text/css" href="https://raw.github.com/ecoal95/CookieTool/master/cookietool.css" />

Encima de </body> (éste es el interesante).

<script src="https://raw.github.com/ecoal95/CookieTool/master/cookietool.js"></script>
<!-- Configuración (ver más abajo) -->
<!-- Otros códigos de configuración (ver más abajo) -->
<script>CookieTool.API.ask();</script>

Uso Blogger

En este caso tendrás que sustituir las comillas dobles por simples.

Uso WordPress

Tendrás que tocar los archivos header.php y footer.php de tu tema. Es posible que haga un plugin, pero por ahora es lo que hay.

Si tienes las estadísticas de JetPack activadas tendrás que desactivarlas, ya que esa cookie la manda el servidor y no se puede hacer nada para evitarlo.

Paso 2: Configurar el script

El script admite algunas opciones para mostrar el mensaje y demás. Justo en el comentario de Configuración es donde debemos ponerlo.

Este es un ejemplo con las opciones más básicas:

<script>
    CookieTool.Config.set('link','/politicadecookies.html'); // Link a la política de cookies
    CookieTool.Config.set('message', 'Este es el mensaje que se mostrará, <a href="{{link}}">política de cookies</a>');
    CookieTool.Config.set('agreetext','Sí, acepto'); // Mensaje del botón de aceptar
    CookieTool.Config.set('declinetext','No, me niego'); // Mensaje del botón de No aceptar
    CookieTool.Config.set('position', 'top'); // top o bottom, la posición del mensaje usando los estilos por defecto.

// También podríamos hacer:
CookieTool.Config.set({
    'link': '/loquesea',
    'message': 'Cualquier cosa'
    // ...
})

</script>

Paso 3: Modificar el código que inserte cookies

Aquí viene cómo modificar los códigos de Analytics y Google Adsense, que son los códigos más frecuentes y los que trata el script por defecto.

Google Adsense

Tendréis que usar el código asíncrono de Google Adsense con una pequeña modificación (aquí viene explicado).

Google Analytics

Tendréis que dejarlo tal y como está, pero sin cargar el script:

Código antiguo (_gaq)

Con dejarlo así vale

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-Y']);
  _gaq.push(['_trackPageview']);
</script>
Código nuevo (isogram)

En este caso el código que carga el script es un poco más difícil de quitar. Sólo hay que quitar el fragmento que va desde 1*new Date() al fin de la función (})(window...)).


<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();
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-27809661-2', 'emiliocobos.net');
  ga('send', 'pageview');

</script>

Otros scripts

Para usar otros scripts tendréis que alterar el código de tal manera que no inserte cookies de primeras, luego podéis usar el script tal que así (en otros códigos de configuración):

<script>
    CookieTool.Event.on('agree', function() {
        // Código que carga las cookies
        // Por elemplo:
        // CookieTool.Utils.loadScript('http://abc.com/script-que-carga-cookies.js');
    });
    CookieTool.Event.on('decline', function() {
        // Borrar las cookies si es posible:
        // CookieTool.Cookie.remove('cookieinsertadaporeseprograma');
    });
</script>

Paso 3: Crear o modificar la página de Política de cookies

Como habéis visto, hay una opción llamada link que lleva a una página (exigida por la ley) llamada política de cookies.

En esa página debéis de explicar qué es una cookie, qué cookies no requeridas instaláis y su finalidad.

Como la herramienta genera una cookie requerida no hará falta añadirla, pero tendréis que añadir una sección llamada Configuración de cookies, donde tenéis que poner el siguiente código html:

<div id="cookietool-settings"></div>

Allí se mostrará una pequeña configuración como en la demo.

Ya!

Pues eso, que ya tendrías tu página acorde a esa salvajada llamada ley de cookies del estado español.

Modificaciones, etc…

Es código libre, así que podéis tocar y cambiar lo que queráis. Cualquier mejora os rogaría que la mandarais a github

Demo Descarga Ver en GitHub

Tú lo has hecho, por qué no lo usas?

Sí lo uso, pero lo uso de un modo “especial”: Yo asumo que vosotros dais el consentimiento, ya que la falta de consentimiento no está tipificada como delito (ver aquí), así que no puede ser sancionada, sin embargo, sí informo y doy opciones para revocar el permiso en mi página de política de cookies.

Si os interesa usarlo así, sólo hace falta cambiar el CookieTool.API.ask() por CookieTool.API.impliedAgreement()

59 pensamientos en “Script para cumplir la ley de cookies

  1. Ley de cookies española y adsense | Emilio Cobos
  2. Imagen de IvanIvan el dijo:

    Hola Emilio,

    Muy buena iniciativa. Chapó otra vez. Sin embargo, sobre tu método de uso… He estado leyendo la web de juridicas.com y no veo por ningún lado lo de que “la falta de consentimiento no está tipificada como delito”. Podrías indicarme dónde puedo encontrar tal afirmación?

    Muchas gracias!

  3. Bitacoras.com
  4. Imagen de EsmolatEsmolat el dijo:

    Hola! gracias a este script he logrado bloquear de forma efectiva la instalación de las cookies de Analytics, aunque he tenido problemas para borrar las cookies cuando despues de aceptarlas las rechazaba desde el control “cookietool-settings”. El metodo que propones con “CookieTool.Cookie.remove” no me funciona, pero he conseguido otra función que borra cookies y he reemplazado el metodo que me falla. ¡¡MUCHAS GRACIAS POR EL SCRIPT!!

    Ahora tengo un problema con youtube… no se como bloquear sus cookies, busco info y no encuentro nada :(. Se cargan al llamar al iframe
    ¿Alguna idea? Muchas gracias de nuevo.

    • Imagen de Emilio Cobos Álvarez el dijo:

      He hecho algunos cambios en el script hace un par de horas, referente justo a esto, es posible que no estés usando la última versión del archivo?

      Las cookies de youtube la forma de no instalarlas es marcando la casilla “Activar el modo de mejora de la privacidad” a la hora de obtener el ćodigo ;)

      • Imagen de EsmolatEsmolat el dijo:

        He actualizado el script a la última versión y ahora todo marcha sobre ruedas. Respecto a youtube, he solucionado el problema haciendo lo que indicas :)

        Muchas gracias por todo y un saludo.

    • Imagen de Emilio Cobos Álvarez el dijo:

      Es cierto, no es que no funcione en firefox, es que se guarda el valor al venir de esta web (que como pone en el artículo acepta las cookies por defecto) y por eso no sale el mensaje.

      El problema es que firefox por defecto al borrar datos no borra el localStorage (donde se guarda tu elección), así que tendrás que borrarlo a mano abriendo la consola y usando localStorage.clear() antes de refrescar la página.

  5. Imagen de alvaro el dijo:

    Gracias Emilio. Esta muy bien el script. Yo me encontre con un problema, a ver si a alguien mas le paso y encontro solucion.

    Al visualizar la web con un iphone, el boton de aceptar no funciona, es decir, le das a aceptar pero no desaparece el cuadro amarillo. He probado contro navegador para iphone y si que funciona, pero con safari que es lo que usa casi todo el mundo, nada de nada.

    Alguna solucion¿?

      • Imagen de EsmlatEsmlat el dijo:

        Hola! por lo que veo has olvidado poner unas etiquetas .

        Busca el fragmento de código:
        CookieTool.Config.set(‘link’,’http://www.nuestra-guerra.com/p/politica-de-cookies.html’);
        CookieTool.Config.set(‘message’, ‘Este es el mensaje que se mostrará, política de cookies‘);
        CookieTool.Config.set(‘agreetext’,’Sí, acepto’);
        CookieTool.Config.set(‘declinetext’,’No, me niego’);
        CookieTool.Config.set(‘position’, ‘top’);

        Y encierralo entre las etiquetas script para que te quede asi:

        CookieTool.Config.set(‘link’,’http://www.nuestra-guerra.com/p/politica-de-cookies.html’);
        CookieTool.Config.set(‘message’, ‘Este es el mensaje que se mostrará, política de cookies‘);
        CookieTool.Config.set(‘agreetext’,’Sí, acepto’);
        CookieTool.Config.set(‘declinetext’,’No, me niego’);
        CookieTool.Config.set(‘position’, ‘top’);

        Si no pones esa etiqueta el navegador no sabe que es un javascript :)

  6. Imagen de antoanto el dijo:

    Hola, estoy intentando añadir el mensaje de las cookies en mi web que está hecha sin usar ningún framwork y no consigo que me funcione. El error que me da la consola es
    SecurityError: The operation is insecure.
    CookieTool.API.ask();

    Alguna idea porque ocurre esto?

  7. Imagen de GilberGilber el dijo:

    Hola Emilio! Primero y antes que nada, felicitarte por el script. Creo que puede solucionar el problema de mucha gente con esto de las cookies… y la crispación general que causa. Un trabajo Genial! ;)

    Te lanzo una pregunta técnica si no es mucha molestia:

    He visto que parte del codigo de Google Analitycs se pone asi (imagino que esta parte es la que contabiliza la información de las visitas, lanza la cookie…):

    // (function() {
    // var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;
    // ga.src = (‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;
    // var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(ga, s);
    // })();

    Con lo cual, entras a la web y el codigo al estar comentado no funciona (no lanza la cookie). Cuando haces el OK he visto que tu script lanza esto:

    CookieTool.Event.on(‘agree’, function() {
    if( window.adsbygoogle ) {
    CookieTool.Utils.loadScript(‘http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js’);
    }
    if( window._gaq ) {
    CookieTool.Utils.loadScript((‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’);
    }
    });

    Solamente activando esta linea: CookieTool.Utils.loadScript((‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’);

    ¿El codigo de Google ya es efectivo con lo cual hace su papel de contar la visita, lanza la cookie… etc etc??
    ¿Aunque las otras 2 lineas esten comentadas, funciona?

    Muchas gracias de nuevo!!

    • Imagen de GilberGilber el dijo:

      Hola de nuevo Emilio, añado otra cuestion, ni codio de google no se parece en nada al de tu script, ¿esto porque? :(

      (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-xxxxxx-1', 'urlweb.com');
        ga('send', 'pageview');
      • Imagen de Emilio Cobos Álvarez el dijo:

        Google ha cambiado el código recientemente. El código antiguo todavía funciona, pero ya tienes una sección en este mismo artículo donde explica cómo implementarlo. He actualizado el script en github para que se comporte consecuentemente.

  8. Imagen de JJJJ el dijo:

    Buen trabajo Emilio, pero he estado comprobando y una vez entro a tu web las cookies se instalan, y si cliko en no aceptar cookies, aun siguen instaladas hasta que las borre, esto no es sancionable?? Menuda m…da se han inventao pa sacar mas pasta aun….

  9. Imagen de Juantxo el dijo:

    ¿Habría una forma sencilla de hacerlo funcionar con el Google DFP (doubleclick for publishers)?

    Yo tengo un codigo como este:

    [script type=’text/javascript’]
    var googletag = googletag || {};
    googletag.cmd = googletag.cmd || [];
    (function() {
    var gads = document.createElement(‘script’);
    gads.async = true;
    gads.type = ‘text/javascript’;
    var useSSL = ‘https:’ == document.location.protocol;
    gads.src = (useSSL ? ‘https:’ : ‘http:’) +
    ‘//www.googletagservices.com/tag/js/gpt.js’;
    var node = document.getElementsByTagName(‘script’)[0];
    node.parentNode.insertBefore(gads, node);
    })();
    [/script]

    [script type=’text/javascript’]
    googletag.cmd.push(function() {
    googletag.defineSlot(‘/xxxx/aaaa’, [336, 280], ‘div-gpt-ad-0000000000-0’).addService(googletag.pubads());
    googletag.pubads().enableSingleRequest();
    googletag.enableServices();
    });
    [/script]

    Y me envia una cookie llamada __gads que no consigo bloquear.

  10. Imagen de Juantxo el dijo:

    Creo que ya lo tengo. he añadido en el script dentro de CookieTool.Event.on(‘agree’, function() { … }:

    if(window.googletag){
    CookieTool.Utils.loadScript(“http://www.googletagservices.com/tag/js/gpt.js”);
    }

    Y lo he eliminado del script de la página quedando:

    [script type=’text/javascript’]
    var googletag = googletag || {};
    googletag.cmd = googletag.cmd || [];
    [/script]
    [script type=’text/javascript’]
    googletag.cmd.push(function() {
    googletag.defineSlot(‘/xxxx/aaaa’, [336, 280], ‘div-gpt-ad-0000000000-0′).addService(googletag.pubads());
    googletag.pubads().enableSingleRequest();
    googletag.enableServices();
    });
    [/script]

    Por si a alguien más le hace falta.
    Si alguien sabe una manera mejor de hacerlo que lo comente por favor ;-)

    • Imagen de Emilio Cobos Álvarez el dijo:

      Sí, es exactamente eso, pero el script está hecho para no tener que editarlo. Simplemente antes de usar el:

      <script>CookieTool.API.ask()</script>

      puedes declarar otro listener al evento agree. Quedaría así:

      <script src="cookietool.js"></script>
      <script>
      	CookieTool.Event.on('agree', function() {
      		if(window.googletag){
      			// Esto lo hace funcionar independientemente de si se usa SSL o no
      			CookieTool.Utils.loadScript(document.location.protocol + "//www.googletagservices.com/tag/js/gpt.js");
      		}
      	});
      	/** Esto es un extra: borra la cookie si el usuario revoca la autorización. Puede fallar si la cookie está como httponly por ejemplo, depende del servicio, pero al ser un extra no hace daño a nadie */
      	CookieTool.Event.on('decline', function() {
      		CookieTool.Cookie.remove("__gads");
      	});
      
      	CookieTool.API.ask();
      </script>
  11. Adsense de forma legal - Optimiza tu web
  12. Imagen de IsabelIsabel el dijo:

    Yo he leído en varias páginas jurídicas que en Europa basta con informar pero en España es obligatorio el dar a elegir al usuario si quiere o no participar y no vale con decir que si sigues navegando por la web es porque lo aceptas. Es una especificación de la ley española. Ya no sé qué pensar porque no me aclaro.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Puedes usar las siguientes etiquetas y atributos HTML:<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre data-language=""> <ul> <ol> <li>
Para poner código usa <pre data-language="[lenguaje]"><code>[código]</code></pre>, y no olvides escapar el HTMl.