Privesy

Generador de banner de cookies

Asegura que tu sitio cumpla con el RGPD y las directivas ePrivacy añadiendo un banner de consentimiento personalizable. Configura el mensaje, copia el código y pégalo en el HTML de tu sitio.

Genera un banner de consentimiento de cookies para tu web en minutos. Configura el mensaje, las categorías y la posición, y copia el código HTML en tu sitio.

Mensaje

Enlace a la política de privacidad

Texto del enlace

Texto del botón

Posición

Categorías de cookies

Necesarias (siempre activas)AnalíticaMarketing

(Marcador del contenido del sitio)


<!-- Cookie Consent Banner by Privesy -->
<style>
  .privesy-cookie-banner {
    position: fixed; bottom: 0; left: 0; right: 0;
    background: #1e293b; color: #f8fafc; padding: 1rem;
    display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap;
    font-family: sans-serif; z-index: 10000;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
  }
  .privesy-cookie-banner a { color: #60a5fa; text-decoration: underline; }
  .privesy-cookie-banner .privesy-prefs { display: flex; gap: 1rem; margin-top: 0.5rem; font-size: 0.85rem; flex-wrap: wrap; }
  .privesy-cookie-banner .privesy-prefs label { display: flex; align-items: center; gap: 0.25rem; cursor: pointer; }
  .privesy-cookie-banner .privesy-btns { display: flex; gap: 0.5rem; flex-wrap: wrap; }
  .privesy-cookie-banner button {
    background: #3b82f6; color: white; border: none; padding: 0.5rem 1rem;
    border-radius: 4px; cursor: pointer; font-weight: bold;
  }
  .privesy-cookie-banner button.privesy-btn-secondary { background: transparent; border: 1px solid #64748b; font-weight: normal; }
</style>
<div id="privesy-cookie-banner" class="privesy-cookie-banner">
  <div>
    We use cookies to improve your experience.
    <a href="https://example.com/privacy" target="_blank" rel="noopener">Learn more</a>
    <div class="privesy-prefs">
      <label><input type="checkbox" checked disabled> Necesarias</label>
      <label><input type="checkbox" id="privesy-analytics" checked> Analítica</label>
      <label><input type="checkbox" id="privesy-marketing"> Marketing</label>
    </div>
  </div>
  <div class="privesy-btns">
    <button onclick="privesyAcceptAll()">
      Accept all
    </button>
    <button class="privesy-btn-secondary" onclick="privesyRejectAll()">Rechazar</button>
    <button class="privesy-btn-secondary" onclick="privesySavePrefs()">Guardar preferencias</button>
  </div>
</div>
<script>
  function privesyHideBanner() {
    document.getElementById('privesy-cookie-banner').style.display = 'none';
  }
  function privesySaveConsent(prefs) {
    localStorage.setItem('privesyCookieConsent', JSON.stringify({ necessary: true, analytics: !!prefs.analytics, marketing: !!prefs.marketing }));
    privesyHideBanner();
  }
  function privesyAcceptAll() {
    privesySaveConsent({ analytics: true, marketing: true });
  }
  function privesyRejectAll() {
    privesySaveConsent({ analytics: false, marketing: false });
  }
  function privesySavePrefs() {
    privesySaveConsent({
      analytics: document.getElementById('privesy-analytics').checked,
      marketing: document.getElementById('privesy-marketing').checked
    });
  }
  (function () {
    try {
      var stored = JSON.parse(localStorage.getItem('privesyCookieConsent') || 'null');
      if (stored && stored.necessary) {
        if (document.getElementById('privesy-analytics')) document.getElementById('privesy-analytics').checked = !!stored.analytics;
        if (document.getElementById('privesy-marketing')) document.getElementById('privesy-marketing').checked = !!stored.marketing;
        privesyHideBanner();
      }
    } catch (e) { /* storage unavailable: keep banner visible */ }
  })();
</script>

Configura el mensaje, el texto del enlace y las categorías de cookies arriba.
Copia el fragmento HTML generado.
Pégalo antes de la etiqueta de cierre body en todas las páginas de tu sitio.

Configuración

Vista previa y código

Cómo añadir el banner a tu sitio