Documentación

¿Cómo pongo el aviso de cookies en mi web?

Siguiendo dos simples pasos:

1. Carga nuestro webcomponent en tu página antes de cerrar la etiqueta <head>

                        
<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>
                        
                    
2. Utiliza el tag <dichosas-cookies></dichosas-cookies> al final de tu contenido.
                        
        .
        .
        .
        <dichosas-cookies></dichosas-cookies>
        <script src="..."></script>
    </body>
</html>
                        
                    

¿Puedo cambiar la posición del aviso?

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>
                        
                    

¿Y el texto del aviso?

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>
                        
                    

Tengo mi propia página de cookies, pero quiero utilizar el componente del aviso

Estamos preparados para eso. Simplemente utiliza el parámetro urlcookies="tu dirección".

                        
<dichosas-cookies urlcookies="/pagina-de-cookies.html"></dichosas-cookies>
                        
                    

¿Y puedo cambiar los colores?

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>
                        
                    

¿Cómo puedo saber qué sucede con el aviso?

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 dominio
  • acepta El usuario acepta el aviso de cookies
  • info 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>
                        
                    

No me aparece el aviso de cookies

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

¿Puedo contactar con vosotros?

¡Claro! Escríbenos a