Cumplir la «Ley de Cookies» con CookieCuttr.js
Mucho se ha dicho desde hace unos meses sobre la “Ley de Cookies”, pero realmente esta ley no existe. Cuándo se habla sobre este tema, realmente nos estamos refiriendo a la LSSI (Ley de Servicios de la Sociedad de la Información) y su modificación por el Real Decreto-Ley 13/2012. En este post vamos a explicar cómo cumplir la “Ley de Cookies” con CookieCuttr.js, un plugin jQuery que nos facilita al máximo esta tarea.
En resumen, esta ley obliga a los titulares de las páginas web profesionales a impedir que se instalen cookies en los ordenadores de los usuarios, a menos que estos hayan dado antes su consentimiento. Hay dos maneras de cumplir con lo que nos dicta la LSSI; la primera es lanzar un mensaje informativo en nuestra web donde se expresa que con el simple hecho de navegar por ella, ya se está dando consentimiento para la instalación de cookies. La segunda es mostrar un mensaje pidiendo permiso al usuario para la utilización de galletas y que, este, tenga el poder de decidir si lo consiente o no. El plugin CookieCuttr nos va a permitir implementar esta segunda opción.
Qué necesitamos
- Biblioteca jQuery
- jquery.cookie.js Descargar en Github
- Plugin CookieCuttr.js Descargar en Github
Preparando el terreno
En primer lugar, colocamos en nuestra carpeta de scripts la biblioteca jQuery, el gestor de galletas jquery.cookie.js y el fichero jquery.cookiecuttr.js. En la carpeta de css vamos a poner el fichero cookiecuttr.css. Nuestra cabecera HTML debería quedar así:
<!-- CSS de CookieCuttr -->
<link href=”css/cookiecuttr.css” rel=”stylesheet” type=”text/css”/>
<!-- Bibliotecas jQuery y javascript -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/jquery.cookiecuttr.js"></script>
El código
La gran ventaja de este plugin es su gran flexibilidad. Por ejemplo, vamos a suponer que en nuestra web usamos cookies para recolectar datos con Google Analytics. Con CookieCuttr podemos:
Usar cookies solo cuando el usuario haya aceptado el aviso. Usaremos la siguiente estructura condicional:
<script type="text/javascript">
if(jQuery.cookie(“cc_cookie_accept”) == “cc_cookie_accept”) {
//Código que no queremos que cargue hasta que el usuario acepte. Aquí pondríamos el código de Google Analytics o lo que nos interese.
}
</script>
Ejecutar cierto código hasta que el usuario decline el aviso:
<script type="text/javascript">
if(jQuery.cookie(“cc_cookie_decline”) == “cc_cookie_decline”) {
//No hacemos nada
}else{
//Código que se ejecuta cuando el usuario declina el aviso.
}
</script>Empieza la acción
Una vez decidamos cómo vamos a usar el plugin, ya solo nos faltará hacer la llamada a su función para implementar la funcionalidad:
<script type="text/javascript">
$.cookieCuttr();
</script>
Si queremos pasar parámetros lo haremos de la siguiente forma:
<script type="text/javascript">
$.cookieCuttr({
opcion1: valor,
opcion2: valor,
opcion3: valor,
...
opcionX: valor
});
</script>
Configuración personalizada
CookieCuttr nos ofrece una gran cantidad de opciones para darnos un completo control sobre su comportamiento:
- cookieAnalytics: si estás usando un paquete de analítica web, puedes poner el valor true para mostrar un mensaje por defecto sin tener que usar un enlace a la política de privacidad. El valor predeterminado es true.
cookieDeclineButton: pondremos true para mostrar botón de declinar.
cookieAcceptButton: pondremos true para esconder el botón de aceptar, por defecto es false.
cookieResetButton: pondremos true para mostrar un botón de reseteo de las cookies, en caso de hacer clic en él, se borran las cookies que haya podido poner (según si aceptamos o no).
cookiePolicyLink: aquí puedes poner un enlace a tu política de privacidad. El parámetro cookieAnalytics tiene que valer false.
cookieAnalyticsMessage: aquí puedes poner el mensaje que quieres que aparezca en la barra del aviso.
cookieWhatAreTheyLink: enlace a nuestra política de privacidad o donde nos interese.
cookieErrorMessage: mensaje que se mostrará en caso de que el plugin no funcione correctamente.
cookieNotificationLocationBottom: por defecto es false. Lo podemos poner a true para mostrar el mensaje de aviso en la parte inferior en vez de la parte superior. De todos modos, el mensaje se mantendrá en la parte superior en dispositivos móviles, iOS y IE6.
cookieCutter: si quieres esconder partes de tu web pon el valor true. En vez de mostrarse ciertos elementos, se mostrará una advertencia sobre el uso de cookies. Va combinado con el parámetro siguiente.
cookieDisable: enumera los elementos separados con coma, que quieres esconder. El parámetro cookieCutter ha de valer true.
cookieAcceptButtonText: texto que aparece en el botón de aceptar.
cookieDeclineButtonText: texto que aparece en el botón de declinar.
cookieResetButtonText: texto que aparece en el botón de reseteo.
cookieWhatAreLinkText: para modificar el texto del enlace que lleva a la ruta que hayamos especificado en la opción cookiePolicyLink.
cookieDiscreetLink: para mostrar un enlace de manera discreta en vez de usar la barra con los botones.
cookieDiscreetLinkText: texto del enlace del parámetro anterior.
cookieDomain: pon tu dominio aquí para eliminar cookies de Google Analytics automáticamente al declinar el mensaje.
Te hemos preparado una demo para que lo veas con tus propios ojos. ¿Aún no cumples con la ley? Endeos puede configurarte el plugin en tu página web, solo ponte en contacto.
Ver demo
