telepliz oficial
Delta
Verificación en dos pasos activada
Usuário com poucas negociações! Use sempre o saldo do ForoBeta!
Agregue este Codigo de aviso de cookiesPerfecto, espero que funcione bien. No dudes en volver si tienes más preguntas. ¡Buenas noches!
Paso 1: Agregar el HTML
Este código define la estructura del aviso de cookies y lo coloca en la parte inferior de tu sitio. Debes copiarlo y pegarlo debajo de la etiqueta <body Recuerda colocar la URL de la pagina de Cookies donde esta el #
Inserir CODE, HTML ou PHP:
<div class='cookie-container'>
<div class='cookie-content'>
Este sitio utiliza cookies para mejorar tu experiencia. Asumiré que estás de acuerdo con esto.
<div class='buttons'>
<button class='item'>Acepto</button>
<a class='item' href='#' target='_blank'>Leer más</a>
</div>
</div>
</div>
Paso 2: Agregar el CSS
Luego, utiliza el siguiente código CSS para dar estilo al aviso de cookies. Debes buscar la etiqueta ]]></b:skin> y pegar el código arriba.
CSS:
/* ESTILOS DEL AVISO DE COOKIES */
:root{
--color-fondo-aviso: #fff; /* Color de fondo del aviso de cookies */
--color-del-parrafo: #000; /* Color del texto del aviso de cookies */
--tamano-parrafo: 16px; /* Tamaño de fuente del texto del aviso de cookies */
--color-boton-aceptar: #f57c00; /* Color de fondo del botón "Acepto" en el aviso de cookies */
--color-texto-boton-aceptar: #fff; /* Color del texto del botón "Acepto" en el aviso de cookies */
--color-texto-leer-mas: #f57c00; /* Color del texto del enlace "Leer más" en el aviso de cookies */
}
.cookie-container{position:fixed;bottom:-100%;left:0;right:0;z-index:999999999999999;transition:400ms;background:var(--color-fondo-aviso);padding:15px;box-shadow:1px 7px 14px -5px rgba(0,0,0,.15);text-align:center;font-size:var(--tamano-parrafo)}
.cookie-content{color:var(--color-del-parrafo)}
.cookie-container.active{bottom:0}
.cookie-content .buttons{display:inline-flex;align-items:center;justify-content:center}
.cookie-content .buttons button{padding:10px 15px;border:none;outline:0;color:var(--color-texto-boton-aceptar);font-size:16px;font-weight:500;border-radius:5px;background:var(--color-boton-aceptar);cursor:pointer;transition:all .3s ease}
.cookie-content .buttons button:hover{transform:scale(0.97)}
.buttons .item{margin:0 10px}
.cookie-content .buttons a{color:var(--color-texto-leer-mas);font-weight:700}
/* FIN ESTILOS DEL AVISO DE COOKIES */
Paso 3: Agregar el JavaScript
Finalmente, incluye el siguiente código JavaScript para hacer que el aviso de cookies sea funcional. Este codgo debes pegarlo arriba de la etiqueta </body>
JavaScript:
<script>
const cookieContainer = document.querySelector(".cookie-container");
const cookieButton = document.querySelector(".buttons .item");
cookieButton.addEventListener("click", () => {
cookieContainer.classList.remove("active");
localStorage.setItem("cookieBannerDisplayed", "true");
});
setTimeout(() => {
if (!localStorage.getItem("cookieBannerDisplayed")) {
cookieContainer.classList.add("active");
}
}, 2000);
</script>
Todo salió perfecto el aviso si funciona