Crear banner para aviso de privacidad de tu sitio web gratis

julio 01, 2022


Hola, amigos de Piensa para Crear.
👋

Si tienes un blog o una web, probablemente has visto esos avisos que aparecen abajo: "Este sitio usa cookies. Aceptar". Y quizás te has preguntado: ¿cómo pongo uno de esos en mi sitio sin pagar ni complicarme?

La respuesta es más simple de lo que parece. Existen varias herramientas gratuitas que generan el código por ti y solo tienes que pegarlo. No necesitas programar, no necesitas pagar y en menos de 10 minutos puedes tener tu aviso funcionando.

En este post te explico cómo crear y colocar un banner de aviso de privacidad en tu sitio web gratis, con opciones tanto para Blogger como para WordPress.


🧠 ¿Por qué necesitas un aviso de privacidad?

Antes de tirar código, entiende el por qué:

  • Es obligatorio en muchos países: Si recibes visitas de la Unión Europea, el RGPD (Reglamento General de Protección de Datos) exige que informes sobre el uso de cookies y pidas consentimiento .

  • Genera confianza: Los visitantes se sienten más seguros cuando ven que tu sitio se toma en serio su privacidad.

  • Protege tu sitio: Si usas Google Analytics, AdSense o píxeles de redes sociales, necesitas avisar a los usuarios .

Dato clave: Google mismo recomienda tener un banner de cookies si usas sus servicios de publicidad o analítica .


🆓 Opciones gratuitas para crear tu banner

Opción 1: Cookie Consent (la clásica, 100% gratis)

Esta es una librería de código abierto que genera un banner minimalista. Es la que Blogger mismo menciona en sus foros de ayuda .

Ventajas:

  • 100% gratuita y de código abierto.

  • Se carga desde CDN (no consumes recursos de tu hosting).

  • Funciona en cualquier sitio (Blogger, WordPress, HTML plano).

  • Personalizable en colores y texto.

Cómo implementarlo en Blogger:

  1. Ve a Diseño → Añadir un gadget → HTML/JavaScript.

  2. Pega este código (sustituye el enlace de política de privacidad por el tuyo):

html
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.css" />
<script src="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.js"></script>
<script>
window.addEventListener("load", function(){
window.cookieconsent.initialise({
  "palette": {
    "popup": {
      "background": "#000"
    },
    "button": {
      "background": "#f1d600"
    }
  },
  "content": {
    "message": "Este sitio utiliza cookies para mejorar tu experiencia.",
    "dismiss": "Entendido",
    "link": "Política de Privacidad",
    "href": "https://piensaparacrear.blogspot.com/p/politica-de-privacidad.html"
  }
})});
</script>
  1. Guarda el gadget y verifica que aparezca en tu sitio .

Personalización rápida:

  • Cambia "#000" por el color que quieras para el fondo.

  • Cambia "#f1d600" por el color del botón.

  • Modifica el texto del mensaje a tu gusto.


Opción 2: Silktide Consent Manager (moderno y gratuito)

Silktide ofrece un generador de banners con una interfaz visual. Configuras los colores y textos en su web, y te dan el código listo para pegar .

Ventajas:

  • Interfaz visual (no tocas código más que para pegarlo).

  • Los archivos se cargan desde jsDelivr (CDN).

  • Cumple con RGPD.

  • Puedes elegir entre banner inferior, superior o modal.

Cómo usarlo:

  1. Ve a silktide.com/consent-manager.

  2. Configura los colores, textos y tipos de consentimiento.

  3. Copia el código que te genera.

  4. Pégalo en el <head> de tu sitio.

En Blogger: Ve a Tema → Editar HTML, busca </head> y pega el código justo antes de cerrar esa etiqueta.

En WordPress: Puedes pegarlo en el header.php de tu tema hijo, o usar un plugin como Insert Headers and Footers .


Opción 3: neiki-cookie-banner (ligero y sin dependencias)

Si buscas algo extremadamente ligero (menos de 1 KB) y que no cargue librerías externas pesadas, esta es tu opción .

Ventajas:

  • Una sola línea de código.

  • Sin dependencias.

  • CSS incluido en el mismo archivo.

  • Licencia MIT (gratis para uso comercial).

Cómo usarlo:

Pega esto antes de </body>:

html
<script src="https://cdn.neiki.eu/neiki-cookie-banner/latest/neiki-cookie-banner.min.js"></script>
<script>
  neikiCookieBanner.init({
    policyLink: 'https://piensaparacrear.blogspot.com/p/politica-de-privacidad.html',
    message: 'Usamos cookies para mejorar tu experiencia.',
    acceptText: 'Aceptar',
    rejectText: 'Rechazar'
  });
</script>

Nota: Como es una librería nueva, verifica que el CDN esté activo antes de confiar en él para producción.


🧩 Cómo colocar el banner en Blogger paso a paso

Si usas Blogger, el proceso es muy sencillo:

Método A: Gadget HTML/JavaScript (el más fácil)

  1. Ve a Diseño en tu panel de Blogger.

  2. Haz clic en Añadir un gadget donde quieras que aparezca (normalmente en el pie de página o en la barra lateral).

  3. Busca HTML/JavaScript y haz clic en el icono +.

  4. Pega el código de cualquiera de las opciones anteriores.

  5. Guarda el gadget.

Ventaja: No tocas el código del tema, así que no hay riesgo de romper nada.

Desventaja: El banner aparece solo en las páginas donde se muestra ese gadget. Si lo pones en el pie, aparecerá en todas.

Método B: Editar el tema directamente

  1. Ve a Tema → Editar HTML.

  2. Busca la etiqueta </head> o </body>.

  3. Pega el código justo antes de la etiqueta de cierre.

  4. Guarda los cambios.

Ventaja: Aparece en todas las páginas automáticamente.

Desventaja: Si te equivocas, puedes romper el tema (haz backup antes).


🧩 Cómo colocar el banner en WordPress

En WordPress tienes dos caminos:

Opción A: Plugin (recomendado para no técnicos)

Instala un plugin gratuito del repositorio de WordPress. Algunos buenos:

  • GetTerms Cookie Consent 

  • aGo Legal 

Pasos:

  1. Ve a Plugins → Añadir nuevo.

  2. Busca el plugin.

  3. Instala y activa.

  4. Configura el banner desde los ajustes del plugin.

  5. Pega el enlace a tu política de privacidad.

Ventaja: No tocas código, actualizaciones automáticas, configuración visual.

Opción B: Código manual (para quien prefiere control)

Si prefieres no instalar plugins, puedes pegar el código de Cookie Consent o Silktide en el header.php de tu tema hijo.

Pasos:

  1. Ve a Apariencia → Editor de archivos del tema.

  2. Selecciona header.php de tu tema hijo.

  3. Pega el código después de <head>.

  4. Guarda.

⚠️ Advertencia: Si no usas tema hijo, perderás los cambios al actualizar el tema. Mejor usa un plugin de snippets como Code Snippets .


🔗 ¿Y la página de política de privacidad?

El banner necesita un enlace a tu página de política de privacidad. Si no la tienes, créala:

En Blogger:

  1. Ve a Páginas → Nueva página.

  2. Titúlala "Política de Privacidad".

  3. Pega el texto de tu política (puedes generarla gratis en TermsFeed ).

  4. Publica.

En WordPress:

  1. Ve a Páginas → Añadir nueva.

  2. Titúlala "Política de Privacidad".

  3. Pega el texto.

  4. Publica.

Luego, en el código del banner, sustituye el enlace de ejemplo por el de tu página real.


✅ Resumen: cuál elegir

OpciónPara quiénComplejidad
Cookie ConsentBlogger, cualquier sitioBaja
SilktideWordPress, sitios modernosBaja-media
neiki-cookie-bannerQuien busca lo más ligeroBaja
Plugin de WordPressUsuarios de WordPress sin ganas de tocar códigoMuy baja

Mi recomendación:

  • Si estás en Blogger, empieza con Cookie Consent y un gadget HTML.

  • Si estás en WordPress, instala un plugin gratuito y configúralo desde el panel.

  • Si quieres algo moderno y visual, prueba Silktide.


🎯 Conclusión: cumplir no tiene por qué costar

Tener un aviso de privacidad en tu sitio no es un lujo ni requiere contratar un abogado. Con las herramientas gratuitas que vimos aquí, puedes tener tu banner funcionando en menos de 10 minutos.

Lo importante es:

  1. Tener una página de política de privacidad (aunque sea básica).

  2. Mostrar el aviso a los visitantes la primera vez que entran.

  3. Enlazar la política desde el banner.

  4. No bloquear el contenido hasta que acepten (a menos que sea obligatorio por ley en tu jurisdicción).

💬 ¿Necesitas ayuda para configurar tu banner de privacidad o crear tu política de cookies?
En Piensa para Crear ofrecemos servicios de configuración legal básica para blogs y tiendas online.
Contáctanos aquí y hablemos.


❓ Preguntas frecuentes

¿Es obligatorio tener un banner de cookies?
Depende de tu país y de dónde vengan tus visitantes. Si recibes tráfico de la UE, sí es obligatorio por el RGPD. En otros países, puede ser recomendable pero no obligatorio .

¿Puedo usar el banner de Google?
Google no ofrece un banner de cookies propio, pero sí exige que si usas AdSense o Analytics, cumplas con las leyes de privacidad.

¿El banner gratuito tiene marca de agua o publicidad?
Cookie Consent, Silktide y neiki-cookie-banner no incluyen publicidad. Son completamente gratuitos y sin marcas.

¿Qué pasa si el usuario rechaza las cookies?
El banner debe permitir rechazar. Si usas Analytics, deberías no cargarlo hasta que el usuario acepte. La mayoría de librerías permiten configurar esto .

¿Necesito saber programar?
No. Con las opciones que vimos aquí, solo copias y pegas. Si usas WordPress, hay plugins que lo hacen todo desde una interfaz visual.

¿Puedo personalizar el diseño?
Sí. Todas las opciones permiten cambiar colores, textos y posición. Cookie Consent, por ejemplo, tiene un sistema de paletas muy flexible .


📚 Recursos relacionados

Comentarios

← Anterior Siguiente →