.svg){kind=icon}
.png)
¿Estás comenzando con Webflow y no encuentras la manera de poner el necesario aviso de cookies a tu página web?
Te voy a confesar algo. Esto es de lo más tedioso que existe a la hora de hacer nuestras webs. Escribir la política de privacidad y el aviso de cookies (hay webs que te lo redactan automáticamente, pero ojo con la legalidad), poner el aviso, maquetarlo, los botones de aceptar y rechazar…
Para los que venís de Wordpress, es relativamente sencillo poner un aviso de cookies mediante plugins y tenemos muchísimas opciones para hacerlo.
Pero estamos aquí para hablar de una de las herramientas NoCode por excelencia, así que vamos a ver cómo podemos cumplir con la RGPD, adecuadamente, en nuestros proyectos en Webflow.
Tenemos varias opciones, pero las más utilizadas son dos: Iubenda y Finsweet. Vamos a verlas y luego, al final de este artículo, te digo cuál me gusta más.
Iubenda es la primera de las opciones que vamos a ver. Es totalmente gratuita y en español. Podremos crear nuestro banner y, además, nos va a ofrecer bastantes opciones para configurarlo y maquetarlo.
Además, si no queremos recurrir a un abogado o asesor para que nos redacte los textos legales, podemos hacerlo desde aquí, siempre y cuando paguemos un nivel superior de suscripción, que dependerá de las necesidades que tengamos y de las visitas que vayamos a registrar en nuestro sitio. Los precios puedes verlos aquí.
El resultado es algo parecido a esto:
Iubenda cumple perfectamente con la RGPD, el marco legal de política de privacidad en Europa.
Otro de los aspectos más chulos de Iubenda es que nos ofrece una amplia variedad de personalización de nuestro banner y, quedan muy bien integrados en nuestra web.
Para generarlo, deberemos de acceder al configurador que nos encontraremos, una vez nos registramos en la herramienta, en la parte de dashboard.
En este configurador tenemos, primeramente, esta página:
Aquí vamos a poder poner nuestra url , ubicar nuestra actividad y usuarios y seleccionar un idioma para el aviso.
Avanzamos y el siguiente apartado nos pregunta qué acuerdos de conformidad vamos a querer que el usuario acepte al pulsar el botón correspondiente.
Lo siguiente ya es adaptar el estilo del banner. Aquí podemos jugar con la posición, el tamaño de la tipografía, los colores de los botones, el fondo, el texto de los botones… Como ves, es súper completa para hacer avisos muy agradables a la vista, pese a lo molestos que resultan siempre que accedemos a una web.
Una vez lo tengamos todo configurado, podremos decidir qué página vamos a conectar con este aviso. Si una que ya tenemos o una generada por Iubenda.
Fácil, ¿verdad?
Vamos con más opciones.
Esta solución viene soportada por una de las empresas más robustas del ecosistema Webflow. Finsweet es, desde hace tiempo, uno de los partner de referencia y responsable de algunas de las herramientas más utilizadas y necesarias dentro de los usuarios de la herramienta.
En este caso, Finsweet nos ofrece una solución gratuita y tremendamente personalizable y potente, marca de la casa.
La herramienta se llama Cookie consent y también cumple con los requerimientos de la RGPD. Su documentación puedes encontrarla en esta dirección.
Un aspecto positivo de esta solución es que es completamente personalizable. Es decir, tú puedes construir el banner con el diseño que quieras. Eso sí, si necesitas inspiración o alguna guía, la podrás encontrar en la documentación de la herramienta.
También podrás clonar algunas de las soluciones ya creadas. Y si no quieres leerte la documentación, podrás verla en vídeo en su página.
A la hora de implementar esta solución, tenemos varias opciones. En la página de la documentación las podemos encontrar en el apartado Setup.
Es recomendable elegir la opción tres porque cumple, de manera completa, con la política de privacidad marcada para Europa.
Una vez elegido este paso previo, tendremos que construir nuestro banner de cookies o clonar uno ya hecho y colocar los diferentes atributos tal y como nos indica la documentación.
Estos atributos son:
Inciso, para colocar los atributos, debemos irnos en nuestro Webflow al panel de la derecha, en la rueda dentada, bajar hasta donde pone Custom Attributes.
Posteriormente, deberemos añadir type="fs-cc" en todos los scripts que emiten cookies. Es decir, si por ejemplo tenemos activado en nuestra web Google Analytics, entonces deberemos colocar esto en el script. Quedaría algo así:
Por último, deberemos añadir un poco de código Javascript a nuestro custom code, en este caso, desde Settings > Custom Code.
El código que hay que añadir es este:
<!-- Finsweet Cookie Consent -->
<script async src="
https://cdn.jsdelivr.net/npm/@finsweet/cookie-consent@1/fs-cc.js
" fs-cc-mode="opt-in"></script>
Una vez hecho esto esto, lo tenemos.
Vale… sé lo que estás pensando. Menudo follón para poner un simple banner, ¿verdad? Pues sí, puede que tengas razón. Estamos hablando de opciones de personalización casi ilimitadas pero, ¿y si no queremos liarnos tanto y queremos ventilarnos esto rápido?
Pues Finsweet nos ofrece una serie de ejemplos clonables que podremos importar en nuestro espacio de trabajo y que podremos, a su vez, coger cualquiera de los ejemplos que nos ofrece y pegarlo en nuestra web.
Una vez copiada la opción que nos guste, la pegaremos en nuestra página web. A partir de aquí, podremos jugar con este componente y cambiar lo que queramos.
Algo sumamente importante es que, una vez que le demos la correspondiente clase y terminemos la edición del componente, debemos de colocar el elemento padre como display:none, para que funcione correctamente.
A partir de aquí, y para facilitarnos la vida, podemos crear un componente reutilizable, o symbol y reutilizarlo en el resto de la página web.
¿Qué te han parecido las dos opciones? Vale… no lo hacemos con un plugin y se acabó, pero gracias a estas dos soluciones, completamente gratuitas, nos estamos asegurando que nuestra parte de aceptación legal funcione correctamente y se adapte a la legislación, además de poder personalizarla al máximo e integrarla completamente en la estética de nuestra web.
Te prometí que te diría cuál me gusta más de las dos. En este caso, por facilidad de uso y resultado final, casi siempre me he decantado por Iubenda. Su facilidad de configuración la hacen ser una opción válida en casi la totalidad de los casos. Ahora bien… si mi página web es un proyecto de autor, que es tan bonita para entrar en Awwwards y que quiere formar parte de un portfolio muy cuidado, sin duda cogería Finsweet, porque me va a dar unas opciones de personalización tremendamente interesantes.
Ya me contarás qué opción es la que eliges tú. ¡Nos vemos por la comunidad!
Notion es la mejor herramienta nocode de organización de vida personal y empresarial.
%2520(1).png)
.png)
.png)
.png)
%2520(1).png)
.png)
.png)
.png)