En la entrada pasada explicaba un poco lo que era la famosa ley de cookies, titule aquella entrada así: Tengo un blog ¿Me afecta a mi la ley de cookies?, pues bien en esa entrada yo dije que les enseñaría como añadir un aviso en el cual le avisaran a sus lectores que sus blog usaban cookies y así evitar cualquier sancion, aunque esta ley aplica solo para blogs españoles es mejor evitar cualquier incidente a futuro, así que manos a la obra.
Este truco funciona tanto para Blogger como para WordPress, y lo que hace es añadir una barra con un aviso sobre el uso de cookies al final de tu blog.
Para usar este truco en Blogger agrega el código siguiente como un gadget en Diseño, Añadir Gadget, HTML/JavaScript , para usarlo en WordPress añadelo en el archivo footer.php
<script src="http://j.maxmind.com/app/geoip.js"></script>
<div id="barritaloca" style="display:none;position:fixed;left:0px;right:0px;bottom:0px;width:100%;min-height:40px;background: #333333;color:#dddddd;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 mostrar publicidad 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:#4682B4;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:#ffffff;">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(geoip_country_code()=="ES" && getCookie('aviso')!="1"){
document.getElementById("barritaloca").style.display="block";
}
function PonerCookie(){
setCookie('aviso','1',365);
document.getElementById("barritaloca").style.display="none";
}
</script>
Con el anterior código el aviso se mostrara solamente para los visitantes españoles que es a los cuales la ley de cookies cobija pero si quieres mostrarlo a todos los usuario entonces agrega el siguiente código:
<div id="barritaloca" style="display:none;position:fixed;left:0px;right:0px;bottom:0px;width:100%;min-height:40px;background: #333333;color:#dddddd;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 mostrar publicidad 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:#4682B4;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:#ffffff;">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("barritaloca").style.display="block";
}
function PonerCookie(){
setCookie('aviso','1',365);
document.getElementById("barritaloca").style.display="none";
}
</script>
Con este pequeño truco te evitaras seguramente muchas molestias y posibles sanciones por la ley de cookies.
Espero que les sea de utilidad este truco, si tienen alguna duda o sugerencia no duden en comentar.
*El creador del script es Cicklow
64 comentarios
Fernando Perez · septiembre 18, 2013 a las 1:26 am
No me gusta este tema del blog, haber si pones uno bueno como el de antes
Gracias, he utilizado tu espacio mucho tiempo y te lo agradezco.
Hayder Juvinao · septiembre 22, 2013 a las 10:33 pm
Amigo gracias por tu comentario, pero este es un truco para Blogger.
Saludos
Díaz de Vivar · septiembre 23, 2013 a las 5:37 pm
¿Cómo ponerlo en la cabecera del blog (en vez de al final)? Muchas gracias por las instrucciones. Más vale prevenir…
Retube Videos · septiembre 30, 2013 a las 8:48 am
Muy buenas. Muy útil el dato aunque no cumple a la perfección la ley (Se necesita consentimiento del usuario antes de instalar ninguna cookie).
Yo lo he implementado en mi blog, pero me gustaría saber si sería posible cambiar la ubicación, por ejemplo metiéndolo en un widget html .
A ver si me puedes decir algo.
Un Saludo
Hayder Juvinao · septiembre 30, 2013 a las 7:41 pm
Claro que se puede cambiar la posición, en la parte del CSS en «position»
Saludos
Retube Videos · septiembre 30, 2013 a las 9:27 pm
¿ Y se podria poner dentro de un eidget html ? Es que me gustaria ponerlo justo encima del slider de la cabecera, y debajo de la barra de la cabecera…
Un Saludo y gracias 🙂
Retube Videos · septiembre 30, 2013 a las 9:30 pm
¿Y que atributo habria que poner en «position» para que lo mostrase arriba de todo ?
Retube Videos · octubre 7, 2013 a las 6:37 pm
He probado y no soy capaz de que quede bien. ¿ Me podrías echar una mano ?
Aitana · octubre 8, 2013 a las 9:53 am
en donde pone style=»display:none;position:fixed;left:0px;right:0px;bottom:0px;width:100%;min-height:40px;background: #333333;color:#dddddd;z-index: 99999;»> en vez de bottom pon top.
Aitana · octubre 8, 2013 a las 9:53 am
En donde pone style=»display:none;position:fixed;left:0px;right:0px;bottom:0px;width:100%;min-height:40px;background: #333333;color:#dddddd;z-index: 99999;»> en vez de bottom pon top.
Retube Videos · octubre 8, 2013 a las 8:58 pm
Muchisimas gracias Aitana, justamente es lo que estaba buscando.
Saludos
Hayder Juvinao · octubre 16, 2013 a las 8:08 pm
Ataina gracias por tu aporte 😉
La verdad estos días no me ha quedado casi tiempo y por eso no había respondido.
Saludos
Az-A · noviembre 9, 2013 a las 4:58 am
Lo implemente en mi blog pero la barra desaparece despues de 1 segundo aproximadamente. ¿Alguna idea de porque?
Nico · noviembre 9, 2013 a las 10:27 am
Quiero cambiar el tamaño del mensaje, en el botón de OK con fondo celeste me aparece sobre las letras del mensaje, gracias.
Héctor Martínez · noviembre 13, 2013 a las 5:18 pm
Únicamente con esto me libro de cualquier denuncia que pueda ponerme la UE por incumplir la normativa de Cookies? Es decir, cumple lanormativa de Cookies al 100%?
Hayder Juvinao · noviembre 22, 2013 a las 9:38 pm
Con esto estas avisando a tus lectores del uso de cookies en tu blog así que si agregas esto si estas acatando la normativa de cookies.
Bruno Villar · noviembre 16, 2013 a las 4:00 pm
Algo sabía sobre este tema, pero no sabía que podía haber sanciones tan fuertes.
Este artículo me salvó la vida con respecto a esto… lo acabo de poner. Muchas gracias.
Hayder Juvinao · noviembre 22, 2013 a las 9:39 pm
Bruno las sanciones como tu mismo dices, son muy severas.
Saludos
Destinoturquia.com · noviembre 21, 2013 a las 11:47 am
También doy las gracias, quiero contestar a una pregunta que decía por la ley hace falta el consentimiento del usuario. Pues, ahí está, en el aviso se pone «si continua navegando, consideramos que acepta el uso de cookies». En muchos sitios web, así es. Si hay otra forma de aceptación, espero la aportación para que sepamos de ella.
Hayder Juvinao · noviembre 22, 2013 a las 9:40 pm
Pues por ahora este es el método mas simple y efectivo para cumplir la ley de cookies 🙂
Saludos
Susana Loor · diciembre 3, 2013 a las 8:40 pm
Gracias estuve buscando y todo lo que encontraba era super complicado, con tu tutorial en 3 segundos listo!!!
Hayder Juvinao · diciembre 7, 2013 a las 9:54 pm
Susana gracias por comentar 😉
Nicolás Ramón · diciembre 8, 2013 a las 6:02 am
A los que no saben de cookies, deberían informarse más. Si vas a insertar este mensaje de uso de Cookies, tienes que aceptar que sí utilizas Cookies propios, tener condiciones del servicio y política de privacidad en tu sitio, Si no lo haces los buscadores van a ignorar tu web, pero eso no es lo peor, si no insertas Cookies propios tendrás un grande problema, claro, si tu sitio es de alguna empresa o alguna cosa del gobierno, ahí si tendrás grabes problemas.
Hayder Juvinao · diciembre 15, 2013 a las 9:07 pm
Nicolas como bien dices esta ley es de mucho cuidado, pero solo afecta a los españoles.
Saludos
Nicolás Ramón · diciembre 24, 2013 a las 2:35 pm
Este comentario ha sido eliminado por el autor.
equilibri · diciembre 22, 2013 a las 1:27 am
Buenas,
Pero veo que no sale en la versión movil de la plantillas, como lo podemos solucionar? gracias
Nicolás Ramón · diciembre 28, 2013 a las 11:12 pm
Hola Equilibri, lo que tienes que hacer es colocar el aviso en la pestaña diseño, luego ir a Editar HTML, expandir la plantilla de artilugios, buscar el widget del aviso de cookies, y para terminar agregar dentro de el widget la línea mobile=»yes» o mobile=»only»
Naiki · enero 4, 2014 a las 1:45 pm
Eso no lo entendí muy bien, ya que no me sale eso de «expandir la plantilla de artilugios».
Un saludo.
Nicholas R. · octubre 11, 2014 a las 4:02 pm
Plantilla de formato…
Hayder Juvinao · octubre 14, 2014 a las 4:17 pm
Nicolas R. tienes buena disposición para ayudar a los demás, podrías ser autor del blog 😉
Saludos
Nicholas R. · noviembre 19, 2014 a las 8:18 am
Soy muy nuevo en esto, tengo 15 años!
Hayder Juvinao · enero 4, 2014 a las 3:33 pm
Como dice Nicolas así se hace 😎
José María Santos · enero 8, 2014 a las 11:46 pm
Puedes explicar este paso?? Lo intento pero no lo comprendo y no consigo q salga el aviso en mobiles
Nicholas R. · septiembre 24, 2014 a las 7:40 am
Echale un vistaso a esto: http://www.oloblogger.com/2013/01/configurar-plantilla-movil-blogger.html
Ceferino M. López Sández · enero 25, 2014 a las 9:21 pm
muchas gracias. Lo he utilizado
Hayder Juvinao · enero 26, 2014 a las 9:45 pm
Ceferino gracias por usar este truco.
Saludos
Kami Boa · enero 26, 2014 a las 11:32 pm
de
Kami Boa · enero 26, 2014 a las 11:34 pm
Hola y enhorabuena por la web. Soy de España y he leído que esto no es suficiente. Hay que informar más ampliamente de las cookies y añadir un política de privacidad. ¿tienes planeado ampliarlo? Seguro que mucha gente, y yo el primero te lo agradecerían. Gracias por compartir.
Hayder Juvinao · enero 27, 2014 a las 8:02 pm
Kami en efecto tienes razón, tenia planteado actualizarla pero creare otra entrada con otro método que si cumple con todo lo especificado en la ley de cookies.
Saludos
Rafael Espejo Garrido · febrero 2, 2014 a las 9:46 pm
Hola Hayder,
Muchas gracias por el tutorial, realmente fácil lo de colocar el aviso, he leído más arriba que no cumple del todo con la dichosa ley de cookies, yo he visto muchas webs que solo incluyen esta misma información así que me apunto con los demás y te doy la enhorabuena! 😉
Por cierto enhorabuena también por tu blog, es el segundo día que doy contigo en resultados de google! 😉
Saludos!!
miltrucos · febrero 19, 2014 a las 3:07 pm
Hola este código también valdría para cualquier tipo web, html php o sólo para blogger?, saludos.
Nicholas R. · septiembre 24, 2014 a las 7:43 am
Este código no tiene dependencias de Blogger, por lo tanto, funciona en todo. 😀
Anonymous · febrero 26, 2014 a las 1:16 pm
Buenas tardes,
Lo primero, gracias por el artículo, y lo segundo es que tengo un pequeño problema. Funciona perfectamente pero la barra sólo aparece al entrar en alguna de las publicaciones de mi blog. Es decir, si alguien entra en mi blog no verá nada, sólo aparecerá el aviso si abre alguno de los artículos…
No sé muy bien a qué se debe y si puedo hacer algo para solucionarlo…
Gracias de antemano y disculpas por las molestias.
Un saludo,
Jan, de nordpop.com
Hayder Juvinao · marzo 13, 2014 a las 12:34 am
Amigo yo si veo la barra en la pagina principal de tu blog.
Saludos
Nicholas R. · septiembre 24, 2014 a las 7:44 am
Recuerda que el aviso sólo se muestra una vez…
ale de viajar cueste lo que cueste · marzo 4, 2014 a las 11:09 am
gracias por el tutorial lo he colocado y ha quedado bien
Hayder Juvinao · marzo 13, 2014 a las 12:36 am
Amigo gracias por comentar.
Saludos
Anonymous · abril 2, 2014 a las 9:29 pm
Gracias por el código.
Lo que no sé es, como ahora parece que ya es válido en la ley que simplemente con clickar en un enlace o con el desplazamiento en scroll (no sé si se dice así) del usuario ya se cumple sin tener que hacer click en Ok o Aceptar. Desde mi ignorancia… ¿Se podría añadir una función a ese script que hiciera desaparecer la barra con esas llamadas acciones positivas. Gran parte de esas barras lo hacen ahora. ¿Sabes como se puede lograr eso? Muchas gracias
Hayder Juvinao · abril 12, 2014 a las 3:22 pm
Amigo tal vez este post de mi amigo Jesús te sirva:
http://www.iniciablog.com/2014/01/ley-de-cookies-en-blogger.html
Saludos
Jose Escribano · abril 13, 2014 a las 11:20 pm
Perfecto: claro y conciso ¡gracias!
Hayder Juvinao · abril 15, 2014 a las 4:47 pm
Jose gracias por comentar :))
Saludos
Guillermo del Pino · mayo 6, 2014 a las 11:16 pm
Una pregunta, que le podemos añadir al código para que en la versión movil de la web se adapte? en la versión web se ve genial pero en la versión movil no se puede pulsar el botón ok ni el de mas información, os dejo mi web http://www.memeo.org
Nicholas R. · septiembre 24, 2014 a las 7:46 am
Este comentario ha sido eliminado por el autor.
Guillermo del Pino · mayo 6, 2014 a las 11:17 pm
Una pregunta, he colocado el código en mi web y en la versión del navegador se ve perfecto, pero en la versión movil de la web se descuadra y no se ve el mensaje completo no se puede pulsar el botón ok ni mas información, la web es http://www.memeo.org alguna idea de que modificar en el código? gracias de antemano.
seo jon · mayo 26, 2014 a las 7:31 pm
Gracias por el aporte!, me sirvió bastante
Alberto · septiembre 3, 2014 a las 3:37 pm
Funciona perfectamente, muchísimas gracias por un truco tan útil y que puedes ahorrarnos tantos problemas legales.
Ivanptc · septiembre 18, 2014 a las 4:02 am
Es de mucha ayuda este post. Gracias.
Anonymous · octubre 7, 2014 a las 10:02 am
Hola!
Genial el post, gracias. Ha servido de mucho!
He instalado el código en las diferentes páginas de una web hecha con html. El problema es que en unas sí aparece la ventana y en otras no. Podrías indicarme el posible motivo??
Muchas gracias!
Carmen
BumeranDelEmpleo · octubre 27, 2014 a las 3:53 pm
Gracias amigo.. Lo modifique por completo.. lo puse en la parte superior de mi Blog y lo cambie al color de mi plantilla, También centre el texto para que tenga una mejor visualización.. Gracias por el código.
Hayder Juvinao · octubre 28, 2014 a las 5:13 pm
Amigo eres muy bueno jugando con los códigos |o|
Saludos
Ángel Vicedo Davó · diciembre 2, 2014 a las 9:00 am
Hola, tengo este aviso insertado en varias webs, pero desde hace unos dias que no se visualiza. Tienes constancia de ello?
Ángel Vicedo Davó · diciembre 2, 2014 a las 9:01 am
Hola, he insertado este aviso en varias de mis webs y todo bien, pero desde hace unos dias que no se visualiza en ninguna. He eliminado los cookies y demás de todos los navegadores y nada,,,
Fran · diciembre 9, 2015 a las 11:40 pm
Hola, a mí me pasa lo mismo, la barra de aceptación de cookies ha dejado de funcionar, básicamente ya no aparece ¿alguna explicación o solución?
Juvinao · diciembre 10, 2015 a las 8:21 pm
Hola Fran, en unos días voy a publicar un nuevo truco para WordPress y Blogger sobre este tema.
Saludos