Personalizar aviso de cookies de Blogger

Personalizar aviso cookieChoiceInfo Google Blogger UE

Aviso de Cookies personalizado de Blogger facil

El aviso de cookies presente en Blogger proviene de Google, por lo que no es posible modificarlo desde la interfaz de Blogger. Sin embargo, si podemos modificar su apariencia mediante CSS y JavaScript.

Estilos

He preparado unos estilos muy básicos pero que le agregarán un toque personal y mas moderno al aviso de cookies. Para agregarlos, ve a Tema > Personalizar > Avanzado > Añadir CSS y pega el siguiente código:

/* Normalizar relleno y borde */
#cookieChoiceInfo,
#cookieChoiceInfo * { box-sizing: border-box }

/* Contenedor */
#cookieChoiceInfo {
  padding: 1.5rem;
  inset: auto 0 0;
  line-height: 1.5;
  background-color: rgb(0 0 0 / 90%);
  animation: 1s forwards cookies;
  transform: translateY(200%);
}

/* Contenedor interno */
#cookieChoiceInfo .cookie-choices-inner {
  font-size: 1rem;
  color: white;
}

/* Texto */
#cookieChoiceInfo .cookie-choices-text {
  margin: 0;
  display: inline;
}

/* Botones */
#cookieChoiceInfo .cookie-choices-button {
  text-transform: initial;
  font-weight: 500;
  margin: 0;
}

/* Botón hover */
#cookieChoiceInfo .cookie-choices-button:hover {
  color: #2196f3;
}

/* Animación al aparecer */
@keyframes cookies {
  to { transform: translateY(0) }
}

He dejado algunos comentarios para que puedas entender mejor lo que hace cada regla. Te motivo a que juegues con los valores y los personalices a tu gusto.

JavaScript

Los textos y la pagina de cookies se pueden personalizar mediante JavaScript. Para ello, ve a Tema > Editar HTML, busca </head> y arriba de eso pega el siguiente código:

<script>//<![CDATA[
cookieOptions = {
  msg: "Mensaje del aviso de cookies",
  close: "Texto del botón cerrar",
  learn: "Texto del botón aprender más",
  link: "Enlace a la página de cookies",
}//]]>
</script>

No olvides personalizar los textos de ejemplo que he dejado. Recuerda que el aviso debe ser lo mas claro posible y estar relacionado con los datos que recopilas. Si no estas seguro de que poner, no realices ningún cambio.

Ver el aviso de cookies

Por defecto el aviso de cookies se mostrará si tu país esta en la lista de países de la Unión Europea. Si no perteneces a esta lista, puedes forzar su aparición agregando ?gl=fr al final de la URL de tu blog.

Conclusion

Aunque es un aspecto muy pequeño, todo suma para mejorar la experiencia de usuario al crear concordancia entre el aviso de cookies y el diseño de tu blog. Si tienes alguna duda, puedes dejarla en los comentarios. Muchas gracias por leerme.