Zum Hauptinhalt springen
Zenovay
Kostenlos20 minutesFortgeschrittene

Cookie-Einwilligung implementieren

Implementieren Sie Cookie-Einwilligungsbanner und integrieren Sie diese mit Zenovay für datenschutzkonforme Analyse-Erfassung. Erfahren Sie mehr über Cookies in diesem Datenschutz-Leitfaden.

cookiesconsentgdprbannercompliance
Zuletzt aktualisiert:

Erfahren Sie, wie Sie Cookie-Einwilligungen implementieren und diese mit Zenovay Analytics für die Einhaltung des Datenschutzes integrieren.

ModusSpeicherung auf Client-SeiteEinwilligung erforderlich
Cookieless-ModusKeine (In-Memory, Window-Scoped IDs)Im Allgemeinen nicht erforderlich
Standard-ModusEin einzelner First-Party Cookie zur Erkennung wiederkehrender BesucherMöglicherweise erforderlich

Zenovay ist immer auf der Serverseite cookieless: Keine IP-Adresse oder personenbezogenen Daten werden gespeichert. Die obige Tabelle bezieht sich nur auf die Speicherung des Tracking-Scripts im Browser des Besuchers. Der Cookieless-Modus verhindert, dass das Script Cookies oder localStorage-Einträge schreibt.

Wann eine Einwilligung erforderlich ist

Einwilligung in der Regel erforderlich bei:

  • Verwendung persistenter Cookies
  • Sitzungsübergreifendem Tracking
  • Identifizierung wiederkehrender Besucher
  • Erhebung personenbezogener Daten

Einwilligung möglicherweise nicht erforderlich bei:

  • Verwendung des Cookieless-Modus (keine Cookies)
  • Ausschließlich notwendiger Funktionalität
  • Anonymen aggregierten Statistiken

Cookieless-Modus (Keine Cookies)

Sie können das Zenovay Tracking-Script im Cookieless-Modus ausführen, der nichts im Browser des Besuchers schreibt. Es gibt zwei Möglichkeiten, diese Funktion zu aktivieren.

Option 1: Script-Attribut. Fügen Sie data-cookieless="true" zu Ihrem Script-Tag hinzu:

<script
  defer
  data-tracking-code="YOUR_TRACKING_CODE"
  data-cookieless="true"
  src="https://api.zenovay.com/z.js"
></script>

Option 2: Website-Einstellung. Öffnen Sie das Dashboard Ihrer Website, gehen Sie zu Einstellungen und aktivieren Sie den Cookieless-Toggle (dieser erscheint in den Registerkarten Allgemein und Erweitert). Die Registerkarte „Allgemein" generiert auch den oben genannten Snippet mit bereits hinzugefügtem data-cookieless="true".

Cookieless-Modus:

  • Verwendet keine Cookies und kein localStorage (nur In-Memory, Window-Scoped IDs)
  • Erstellt keine persistenten Identifikatoren
  • Rechtmäßig vor der Einwilligung gemäß ePrivacy für das Zenovay-Tracking-Script selbst
  • Etwas weniger genaue Daten zu wiederkehrenden Besuchern (etwa 10-15% weniger Unique Visitor)

Andere Tools, die Sie laden (Meta Pixel, Google Analytics und ähnliche), setzen immer noch ihre eigenen Cookies und erfordern möglicherweise eine Einwilligung unabhängig von dieser Einstellung.

Bedingtes Laden

Einfache Einwilligungsprüfung

// Einwilligung prüfen, bevor geladen wird
function loadZenovayIfConsented() {
  const consent = localStorage.getItem('analytics_consent');

  if (consent === 'granted') {
    loadZenovay();
  } else if (consent === 'denied') {
    // Analytics nicht laden
  } else {
    showConsentBanner();
  }
}

function loadZenovay() {
  const script = document.createElement('script');
  script.src = 'https://api.zenovay.com/z.js';
  script.setAttribute('data-tracking-code', 'YOUR_TRACKING_CODE');
  script.defer = true;
  document.head.appendChild(script);
}

// Beim Laden der Seite ausführen
loadZenovayIfConsented();

Einfaches Einwilligungsbanner

<div id="cookie-banner" style="display: none;">
  <div class="cookie-content">
    <p>Wir verwenden Analysen, um Ihre Erfahrung zu verbessern.</p>
    <button onclick="acceptCookies()">Akzeptieren</button>
    <button onclick="declineCookies()">Ablehnen</button>
    <a href="/privacy">Mehr erfahren</a>
  </div>
</div>

<script>
function showConsentBanner() {
  document.getElementById('cookie-banner').style.display = 'block';
}

function acceptCookies() {
  localStorage.setItem('analytics_consent', 'granted');
  document.getElementById('cookie-banner').style.display = 'none';
  loadZenovay();
}

function declineCookies() {
  localStorage.setItem('analytics_consent', 'denied');
  document.getElementById('cookie-banner').style.display = 'none';
  // Optional im Cookieless-Modus laden
  loadZenovayCookieless();
}

function loadZenovayCookieless() {
  // data-cookieless="true" teilt dem Tracker mit, dass er nur In-Memory-
  // Window-Scoped IDs verwenden soll - keine Cookies, kein localStorage.
  const script = document.createElement('script');
  script.src = 'https://api.zenovay.com/z.js';
  script.setAttribute('data-tracking-code', 'YOUR_TRACKING_CODE');
  script.setAttribute('data-cookieless', 'true');
  script.defer = true;
  document.head.appendChild(script);
}
</script>

Beliebte Einwilligungsplattformen

Cookiebot-Integration

// Auf Cookiebot-Einwilligung warten
window.addEventListener('CookiebotOnAccept', function() {
  if (Cookiebot.consent.statistics) {
    loadZenovay();
  }
});

// Einwilligungsänderungen behandeln
window.addEventListener('CookiebotOnDecline', function() {
  // Einwilligung widerrufen - Tracking stoppen
  if (window.zenovay) {
    window.zenovay('disable');
  }
});

Cookiebot-Konfiguration:

  1. Zenovay zur Kategorie „Statistiken" hinzufügen
  2. Cookie-Name festlegen: zenovay_session
  3. Anbieter festlegen: zenovay.com
  4. Typ festlegen: HTTP
  5. Ablauf festlegen: Session oder 1 Jahr

OneTrust-Integration

// OneTrust Einwilligungs-Callback
function OptanonWrapper() {
  if (OnetrustActiveGroups.includes('C0002')) {
    // Performance-Cookies genehmigt
    loadZenovay();
  } else {
    // Cookieless-Modus laden
    loadZenovayCookieless();
  }
}

OneTrust-Kategorien:

  • C0001: Unbedingt erforderlich
  • C0002: Leistung (Zenovay)
  • C0003: Funktional
  • C0004: Targeting

Osano-Integration

// Osano Einwilligungs-Callback
window.Osano.cm.addEventListener('osano-cm-consent-changed', function(event) {
  if (event.ANALYTICS === 'ACCEPT') {
    loadZenovay();
  }
});

Termly-Integration

// Termly Einwilligungs-Callback
window.addEventListener('termly-consent-preferences-updated', function(e) {
  if (e.detail.analytics) {
    loadZenovay();
  }
});

Integration

// Google Consent Mode initialisieren
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

gtag('consent', 'default', {
  'analytics_storage': 'denied'
});

// Bei Einwilligung aktualisieren
function updateConsent(granted) {
  gtag('consent', 'update', {
    'analytics_storage': granted ? 'granted' : 'denied'
  });

  if (granted) {
    loadZenovay();
  }
}

Mit Zenovay

Verwenden Sie den oben gezeigten Ansatz des bedingten Ladens, um Zenovay erst nach Erteilung der Einwilligung über den Google Consent Mode zu laden:

// Zenovay erst nach Erteilung der Analytics-Einwilligung laden
function updateConsent(granted) {
  gtag('consent', 'update', {
    'analytics_storage': granted ? 'granted' : 'denied'
  });

  if (granted) {
    const script = document.createElement('script');
    script.src = 'https://api.zenovay.com/z.js';
    script.setAttribute('data-tracking-code', 'YOUR_TRACKING_CODE');
    script.defer = true;
    document.head.appendChild(script);
  }
}

React-Implementierung

Einwilligungs-Context

// ConsentContext.js
import { createContext, useContext, useState, useEffect } from 'react';

const ConsentContext = createContext();

export function ConsentProvider({ children }) {
  const [consent, setConsent] = useState(() => {
    return localStorage.getItem('analytics_consent') || 'pending';
  });

  const grantConsent = () => {
    localStorage.setItem('analytics_consent', 'granted');
    setConsent('granted');
  };

  const denyConsent = () => {
    localStorage.setItem('analytics_consent', 'denied');
    setConsent('denied');
  };

  return (
    <ConsentContext.Provider value={{ consent, grantConsent, denyConsent }}>
      {children}
    </ConsentContext.Provider>
  );
}

export const useConsent = () => useContext(ConsentContext);

Einwilligungsbanner-Komponente

// CookieBanner.js
import { useConsent } from './ConsentContext';

export function CookieBanner() {
  const { consent, grantConsent, denyConsent } = useConsent();

  if (consent !== 'pending') return null;

  return (
    <div className="cookie-banner">
      <p>Wir verwenden Cookies, um den Website-Traffic zu analysieren.</p>
      <button onClick={grantConsent}>Akzeptieren</button>
      <button onClick={denyConsent}>Ablehnen</button>
    </div>
  );
}

Bedingte Analyse

// Analytics.js
import { useEffect } from 'react';
import { useConsent } from './ConsentContext';

export function Analytics({ websiteId }) {
  const { consent } = useConsent();

  useEffect(() => {
    if (consent === 'granted') {
      const script = document.createElement('script');
      script.src = 'https://api.zenovay.com/z.js';
      script.setAttribute('data-tracking-code', websiteId);
      script.defer = true;
      document.head.appendChild(script);
    } else if (consent === 'denied') {
      // Analytics nicht laden, wenn Einwilligung abgelehnt wurde.
      // Wenn Sie dennoch minimales Tracking wünschen, laden Sie das Script
      // stattdessen mit data-cookieless="true" (keine Cookies, kein localStorage).
    }
  }, [consent, websiteId]);

  return null;
}

Vue.js-Implementierung

<!-- CookieConsent.vue -->
<template>
  <div v-if="showBanner" class="cookie-banner">
    <p>Wir verwenden Cookies für Analysen.</p>
    <button @click="accept">Akzeptieren</button>
    <button @click="decline">Ablehnen</button>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';

const showBanner = ref(false);

onMounted(() => {
  const consent = localStorage.getItem('analytics_consent');
  if (!consent) {
    showBanner.value = true;
  } else if (consent === 'granted') {
    loadZenovay();
  }
});

function accept() {
  localStorage.setItem('analytics_consent', 'granted');
  showBanner.value = false;
  loadZenovay();
}

function decline() {
  localStorage.setItem('analytics_consent', 'denied');
  showBanner.value = false;
  loadZenovayCookieless();
}

function loadZenovay() {
  const script = document.createElement('script');
  script.src = 'https://api.zenovay.com/z.js';
  script.setAttribute('data-tracking-code', 'YOUR_TRACKING_CODE');
  document.head.appendChild(script);
}

function loadZenovayCookieless() {
  // data-cookieless="true" teilt dem Tracker mit, dass er nur In-Memory-
  // Window-Scoped IDs verwenden soll - keine Cookies, kein localStorage.
  const script = document.createElement('script');
  script.src = 'https://api.zenovay.com/z.js';
  script.setAttribute('data-tracking-code', 'YOUR_TRACKING_CODE');
  script.setAttribute('data-cookieless', 'true');
  document.head.appendChild(script);
}
</script>

Seite für Einwilligungspräferenzen

Ermöglichen Sie Benutzern, ihre Präferenzen zu ändern:

<div class="cookie-preferences">
  <h2>Cookie-Einstellungen</h2>

  <div class="cookie-option">
    <label>
      <input type="checkbox" id="necessary" checked disabled>
      Notwendige Cookies (Erforderlich)
    </label>
    <p>Unverzichtbar für die Funktion der Website.</p>
  </div>

  <div class="cookie-option">
    <label>
      <input type="checkbox" id="analytics">
      Analyse-Cookies
    </label>
    <p>Helfen uns zu verstehen, wie Besucher unsere Website nutzen.</p>
  </div>

  <button onclick="savePreferences()">Einstellungen speichern</button>
</div>

<script>
// Aktuelle Einstellungen laden
document.getElementById('analytics').checked =
  localStorage.getItem('analytics_consent') === 'granted';

function savePreferences() {
  const analytics = document.getElementById('analytics').checked;
  localStorage.setItem('analytics_consent', analytics ? 'granted' : 'denied');

  // Seite neu laden, um Änderungen anzuwenden
  location.reload();
}
</script>

Einwilligungsprotokollierung

Einwilligungen für die Compliance erfassen:

function logConsent(type, granted) {
  fetch('/api/consent-log', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      type: type,
      granted: granted,
      timestamp: new Date().toISOString(),
      userAgent: navigator.userAgent
    })
  });
}

function acceptCookies() {
  logConsent('analytics', true);
  localStorage.setItem('analytics_consent', 'granted');
  loadZenovay();
}

Best Practices

  • Klare Sprache: Erklären Sie, wozu die Cookies dienen
  • Gleichwertige Optionen: Akzeptieren und Ablehnen gleich prominent darstellen
  • Keine Dark Patterns: Benutzer nicht zum Akzeptieren verleiten
  • Granulare Kontrolle: Benutzern die Auswahl nach Kategorien ermöglichen
  • Einfacher Widerruf: Änderung der Einstellungen ermöglichen

Technisch

  • Nicht vor der Einwilligung laden: Tracking erst nach Einwilligung laden
  • Widerruf respektieren: Tracking bei Widerruf der Einwilligung stoppen
  • Einstellungen merken: Nicht wiederholt nachfragen
  • Gründlich testen: Einwilligungsablauf überprüfen

Compliance

  • Einwilligungen dokumentieren: Protokollieren, wann Einwilligungen erteilt/widerrufen wurden
  • Regelmäßige Überprüfung: Bei Änderungen der Vorschriften aktualisieren
  • Prüfpfad: Aufzeichnungen für die Compliance aufbewahren

Fehlerbehebung

Tracking nach Ablehnung noch aktiv

Überprüfen Sie:

  • Script nicht fest im HTML eingebunden
  • Einwilligungsprüfung wird vor jeglichem Tracking ausgeführt
  • Keine Caching-Probleme

Überprüfen Sie:

  • localStorage nicht blockiert
  • Cookie läuft nicht sofort ab
  • Gleiche Domain für alle Seiten

Einwilligungsplattform löst nicht aus

Stellen Sie sicher:

  • Integrationscode ist korrekt
  • Plattform ist vollständig geladen, bevor die Prüfung erfolgt
  • Callback-Namen stimmen überein

Nächste Schritte

Zugehörige Artikel

  1. Brauche ich mit Zenovay ein Cookie-Consent-Banner?

    Im Cookieless-Modus (Standard) benötigen Sie kein Banner allein für Zenovay. Hier erfahren Sie, wann Sie trotzdem eines benötigen und was es abdecken muss.

  2. Einwilligungs- und Datenschutzmetriken: Performance Ihres Cookie-Banners sehen

    Sehen Sie die Annehmen-/Ablehnen-/Schließen-Rate Ihres eigenen Cookie-Banners im Zeitverlauf, eine Aufteilung in identifiziert vs. anonymisiert und ein Datenherkunfts-Audit — gespeist durch eine Codezeile aus Ihrem Banner. Zenovay bleibt cookielos.

  3. Richtlinien zur Datenaufbewahrung

    Verstehen Sie Zenovays zweiphasigen Lebenszyklus der Datenaufbewahrung, planspezifische Aufbewahrungsfristen und wie Sie verborgene Daten durch Upgrades wiederherstellen können.

War dieser Artikel hilfreich?