Añadir cookie consent sin plugin para WordPress
Tabla de contenidos
Saludos amigos, en el artículo de hoy voy a hablar acerca de las Cookie Consent.
Normalmente, estas se presentan en un formato de barra horizontal en el top o el bottom del sitio web.
Cookie Consent
Lanzan un mensaje al usuario visitante, para que esté al tanto de que nuestro sitio web utiliza cookies.
Es habitual que aparezcan un enlace hacia la página de política de cookies y un botón para aceptar.
Voy a enseñaros cómo añadir una barra de Cookie Consent sin necesidad de plugin para nuestro WordPress.
¿Qué es una Cookie?
- Una galleta informática o cookie es una pequeña información enviada por un sitio web.
- Se almacena en el navegador del usuario.
- De manera que el sitio web puede consultar la actividad previa del usuario.
¿Qué propósito tienen?
- Las cookies son utilizadas habitualmente por los servidores de aplicaciones para diferenciar usuarios.
- Para actuar de diferente forma dependiendo de estos.
- Las cookies se inventaron para ser utilizadas en una cesta de la compra virtual.
- Que actúa como dispositivo virtual en el que el usuario va «colocando» los elementos que desea adquirir.
- De forma que los usuarios puedan navegar por el sitio donde se muestran los objetos a la venta.
- Añadirlos y eliminarlos de la cesta de la compra en cualquier momento.
Preparando el código
- Crea un archivo de texto en tu escritorio.
- Copia y pega el código que verás a continuación, en el archivo de texto.
- Modifica el apartado «link» cambiando la URL de tu política de cookies de tu sitio web.
- Ves al dashboard de tu sitio web con WordPress.
- Haz clic en Apariencia>Editor
- Localiza el archivo header.php en la lista de la derecha y haz clic en él.
- Busca la etiqueta <body> y añade el texto modificado del archivo de texto.
- Listo, ya tienes una barra de Cookies en tu sitio web, sin necesidad de plugin.
Código para editar
<script type="text/javascript">
window.cookieconsent_options = {
"message":"¡Hola! Mi sitio web utiliza cookies para asegurar que obtengas la mejor experiencia de navegación en mi web",
"dismiss":"Acepto!",
"learnMore":"Mas info",
"link":"https://www.tusitioweb.com/cookies/",
"theme":"dark-bottom"};
</script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/1.0.10/cookieconsent.min.js"></script>Espero que este artículo te haya servido de ayuda.
Buen articulo compañero, me sirvió mucho!
Con esto me quito otro plugin de encima en mi web muyblogger.com
Para todas las personas que buscan quitarse plugin y no recargar la base de datos le vendrá muy pero que muy bien, pero me surge una ultima duda, ¿como puedo cambiar el color del botón.
gracias y un saludo.
Hola Daniel, me alegro mucho que mi artículo te haya ayudado!
En respuesta a tu duda, tan solo debes añadir en una hoja de CSS o en la misma página el siguiente código CSS:
.cc_container .cc_btn, .cc_container .cc_btn:visited {
background-color: #FF5722 !important;
}
Tan solo deberás cambiar el background-color por el color que quieras, espero te ayude 😎
Muchas gracias compañero!, voy a probar a ver que tal.
Hola Marc!
Muchas gracias por el artículo, me ha ido genial. 🙂 Sólo me falta saber como cambiar el color tanto del texto de «más info» y el color del texto del botón (no el fondo). ¿Podrías decirme cómo hacerlo?
Muchas gracias de nuevo!
Hola Judit, me alegro que mi artículo ayude 🙂
Respecto a tu pregunta, deberías poder cambiar los colores mediante CSS.
.cc_btnsería para el botón, mediante la reglabackground-color: #f1d600 !important;.cc_container asería para el enlace «mas info» mediante la reglacolor: #31a8f0 !important;Con añadir estás reglas a tu CSS, por ejemplo en Apariencia>Personalizar>CSS adicional podrás añadir dichas reglas, tan solo deberás cambiar los colores a tu elección. Espero haber aclarado tu duda, cualquier cosa estoy a tu disposición.