Poner el aviso de uso de cookies en nuestro blog

Hola amores!!

La verdad es que en este país se inventan leyes y normativas bastante absurdas, y ahora les ha dado por la política de uso de los cookies.

Y para que no nos caiga una multa del copón hay que poner un aviso en el que se informa a los lectores del blog que se está recopilando información  de sus visitas, lo que ya he nombrado como cookies.

¿Y que son las cookies? Pues básicamente son datos que recopila Google Analytics, AdSense u otras herramientas del estilo para saber cuánto tiempo pasan nuestros lectores en la web, que es lo que les gusta y otros datos para proporcionarnos estadísticas o mejorar los anuncios.

Pues pensando que yo uso esos servicios, pues decidí ponerme manos a la obra y poner el dichoso anuncio para evitar que me puedan multar.

Y no era tan fácil como yo me pensaba, que no se si os habrá pasado a vosotras, pero yo me pensaba que al estar usando Blogger, Google sería de ayuda y proporcionaría este sencillo código para ayudar, peeeero no!

Así que me puse a buscar por internet y a preguntar a compis, y al final dimos con el siguiente código que es el que imagino que mucha gente está usando.

Y para que lo tengáis más a mano y no perdáis tiempo buscando, aquí os lo comparto, ¿vale?

Este es el código que tenéis que copiar y pegar en vuestro blog. Simplemente hay que ir a plantilla y anadir un gadget de html/Javascript y pega el contenido en el interior

<div id="barra" style="display:none;position:fixed;left:0px;right:0px;bottom:0px;width:100%;min-height:40px;background: #565f98;color:#f9f5c5;z-index: 99999;">

<div style="width:100%;position:absolute;padding-left:5px;font-family:verdana;font-size:12px;top:30%;">

Usamos cookies propias y de terceros para ofrecer información personalizada según su navegación. Si continua navegando consideramos que acepta el uso de cookies.

 <a href="javascript:void(0);" style="padding:4px;background:#dfb85b;text-decoration:none;color:#fff;" onclick="PonerCookie();"><b>OK</b></a>

 <a href="http://www.google.com.ar/intl/es-419/policies/technologies/types/" target="_blank" style="padding-left:5px;text-decoration:none;color:#f9f5c5;">Más información</a>

</div>

</div>

<script>

function getCookie(c_name){

 var c_value = document.cookie;

 var c_start = c_value.indexOf(" " + c_name + "=");

 if (c_start == -1){

  c_start = c_value.indexOf(c_name + "=");

 }

 if (c_start == -1){

  c_value = null;

 }else{

  c_start = c_value.indexOf("=", c_start) + 1;

  var c_end = c_value.indexOf(";", c_start);

  if (c_end == -1){

   c_end = c_value.length;

  }

  c_value = unescape(c_value.substring(c_start,c_end));

 }

 return c_value;

}

function setCookie(c_name,value,exdays){

 var exdate=new Date();

 exdate.setDate(exdate.getDate() + exdays);

 var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());

 document.cookie=c_name + "=" + c_value;

}

if(getCookie('aviso')!="1"){

 document.getElementById("barra").style.display="block";

}

function PonerCookie(){

 setCookie('aviso','1',365);

 document.getElementById("barra").style.display="none";

}

</script>

Si copiais tal cual el código os saldrá una barra igualita a la mía, así que para personalizarla tenéis que estar atentos a este trocito del código.

<div id="barra" style="display:none;position:fixed;left:0px;right:0px;bottom:0px;width:100%;min-height:40px;background: #565f98;color:#f9f5c5;z-index: 99999;">

<div style="width:100%;position:absolute;padding-left:5px;font-family:verdana;font-size:12px;top:30%;">

Usamos cookies propias y de terceros para ofrecer información personalizada según su navegación. Si continua navegando consideramos que acepta el uso de cookies.

 <a href="javascript:void(0);" style="padding:4px;background:#dfb85b;text-decoration:none;color:#fff;" onclick="PonerCookie();"><b>OK</b></a>

 <a href="http://www.google.com.ar/intl/es-419/policies/technologies/types/" target="_blank" style="padding-left:5px;text-decoration:none;color:#f9f5c5;">Más información</a>

</div>

Sólo tenéis que sustituir lo que hay en color por vuestros códigos de colores, claramente tenéis que poner el color en hexadecimal, pero si habéis toqueteado un poco la plantilla al elegir los colores, pues lo sabéis ya.

Al lío, lo modificable es lo siguiente:

background: #565f98 este es el color de fondo de la barra entera

color:#f9f5c5 este es el color del texto de la barra

background:#dfb85b este es el fondo del OK

color:#f9f5c5 y ese es el color del texto “más información”

Y modificando eso y usando vuestros colores, ya tenéis la barra hecha!

La verdad es que no es una cosa muy complicada, y ahora que está por aquí el código, pues mucho más rápido.

¡Espero que os sirva de ayuda y que podáis instalar el aviso de una manera rápida y fácil!

¡Nosotros nos vemos el lunes en un nuevo post!

Un besazo!