Script para cumplir la ley de cookies

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