E
Estela
Must have reject button. like this:
<style>
#cookie-banner {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: rgba(0, 0, 0, 0.7); /
Fondo transparente
/
color: white;
text-align: center;
padding: 15px;
z-index: 9999;
}
#cookie-banner button {
margin: 5px;
padding: 10px 20px;
border: none;
cursor: pointer;
border-radius: 5px; /
Botones redondeados
/
}
#accept-cookies {
background-color: green;
color: white;
}
#reject-cookies {
background-color: red;
color: white;
}
#cookie-banner a {
color: lightblue;
text-decoration: underline;
}
</style>
<script>
document.addEventListener("DOMContentLoaded", function() {
var banner = document.createElement('div');
banner.id = 'cookie-banner';
banner.innerHTML = `
<p>This website uses cookies to improve your experience. Do you accept its use?<a href="https://www.web.com/cookie" target="_blank">More information</a></p>
<button id="accept-cookies">Accept</button>
<button id="reject-cookies">Reject</button>
`;
document.body.appendChild(banner);
document.getElementById('accept-cookies').onclick = function() {
setCookie('cookies_accepted', 'true', 365);
document.getElementById('cookie-banner').style.display = 'none';
loadTrackingScripts();
};
document.getElementById('reject-cookies').onclick = function() {
setCookie('cookies_accepted', 'false', 365);
document.getElementById('cookie-banner').style.display = 'none';
};
function setCookie(name, value, days) {
var expires = "";
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days
24
60
60
1000));
expires = "; expires=" + date.toUTCString();
}
document.cookie = name + "=" + (value || "") + expires + "; path=/";
}
function getCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function loadTrackingScripts() {
//------------------------------------------------
//
// Here you can add your tracking scripts
//
//------------------------------------------------
}
// Comprueba el estado de las cookies
var cookiesAccepted = getCookie('cookies_accepted');
if (cookiesAccepted === 'true') {
loadTrackingScripts();
document.getElementById('cookie-banner').style.display = 'none';
} else if (cookiesAccepted === 'false') {
document.getElementById('cookie-banner').style.display = 'none';
} else {
document.getElementById('cookie-banner').style.display = 'block';
}
});
</script>
July 2, 2024