Siguiendo dos simples pasos:
1. Carga nuestro webcomponent en tu página antes de cerrar la etiqueta <head>
2. Utiliza el tag <dichosas-cookies></dichosas-cookies> al final de tu contenido.<html> <head> <title>...</title> . . . <script type="module" src="https://lasdichosascookies.com/js/dist/dichosas-cookies/dichosas-cookies.esm.js"></script> <script nomodule="" src="https://lasdichosascookies.com/js/dist/dichosas-cookies/dichosas-cookies.js"></script> </head>
. . . <dichosas-cookies></dichosas-cookies> <script src="..."></script> </body> </html>
Sí. Por defecto la franja con el aviso aparece en la parte inferior de la página, pero se puede colocar en la parte superior usando el parámetro pos="top". También puedes quitar el borde y hacer que aparezca como una franja completa con el parámetro borderless="1"
<dichosas-cookies pos="top" borderless="1"></dichosas-cookies>
También. Simplemente escribe el texto que deseas dentro del tag <dichosas-cookies>
<dichosas-cookies>lorem ipsum dolor sit amet consectetur adipiscing elit...</dichosas-cookies>
Estamos preparados para eso. Simplemente utiliza el parámetro urlcookies="tu dirección".
<dichosas-cookies urlcookies="/pagina-de-cookies.html"></dichosas-cookies>
Seguro que sí, para eso solo necesitas conocer las variables que hemos utilizado en el componente y definirlas en tu propia hoja de estilos:
--main-bg-color es el color de fondo (por defecto #FFFFFF)--border-color es el color del borde (por defecto #000000)--color es el color del texto de aviso (por defecto #000000)--btn-bg-color es el color de fondo de los botones (por defecto #2AABD2)--btn-fg-color es el color de texto de los botones (por defecto #FFFFFF)
<style> dichosas-cookies { --main-bg-color: #000; --border-color: #fff; --color: #fff; --btn-bg-color: #f00; --btn-fg-color: #000; } </style>
Para que la página web conozca la respuesta del usuario al aviso de cookies, nuestro componente emite un evento denominado estado que contendrá un literal dependiendo de lo que suceda, a saber:
aceptado El aviso de cookies fue aceptado con anterioridad en este dominioacepta El usuario acepta el aviso de cookiesinfo El usuario pulsa el botón de más información
<script> document.querySelector('dichosas-cookies').addEventListener('estado', function(e) { console.log(e.detail); }); </script>
Esto puede suceder por varios motivos. Lo más habitual es no haber cargado correctamente el componente. Revisa el primer punto y verifica que el componente se carga en el bloque <head> de tu página html.
Si estás seguro de que el componente está bien insertado, es posible que no aparezca porque ya se han aceptado las cookies, y este permiso dura 30 días. Para revisarlo, puedes volver a cargar la página usando el modo incógnito de tu navegador, o verificar si tienes una cookie instalada de nombre cookiesucuc. De ser así, con eliminarla y recargar la página será suficiente
¡Claro! Escríbenos a [email protected]