Dokumentation
Einbindung in 5 Minuten
Das Snippet bekommst du nach dem Anlegen einer Property unter Property → Einbindung. Es sieht so aus:
<script src="https://consented.eu/sdk/dist/stub.js" data-block="googletagmanager.com/gtag|connect.facebook.net"></script> <script async src="https://consented.eu/p/DEINE-PROPERTY-ID/cmp.js"></script>
Die erste Zeile ist der Loader: synchron, rund 2 KB über die Leitung, und er muss vor jedem anderen Skript stehen — auch vor dem Google Tag Manager. Er blockiert die in data-block genannten Muster sofort und setzt die Consent-Mode-Standardwerte. Beides liest er von seinem eigenen Script-Tag, weil er läuft, bevor die Konfiguration der Property existiert. Änderst du deine Dienste oder den Consent-Mode-Schalter, füge das Snippet erneut ein.
Sprache des Banners: zuerst die Sprache der Seite aus <html lang>, dann ein data-lang-Attribut am Script-Tag (<script async src="…/cmp.js" data-lang="de">) oder an <html>, zuletzt die Browsersprache. Gewinnen können nur Sprachen, die in der Property aktiviert sind. Die Reihenfolge und ein Sprachmenü für Besucher stellst du unter Property → Einstellungen ein.
Deklarativ — für Skripte, die du selbst einbindest:
<script type="text/plain" data-consented="google-analytics-4"> gtag('config', 'G-XXXXXXX'); </script>
Musterbasiert — für Skripte, die andere einbinden:
Trage bei jedem Dienst URL-Fragmente ein (z. B. googletagmanager.com/gtag). Ein MutationObserver entfernt das src-Attribut, sobald das Element im Dokument auftaucht — auch tief in einem nachträglich eingefügten Block —, und setzt es nach der Einwilligung wieder.
appendChild ein, ist das ein Wettrennen mit dem Ladevorgang, das der Observer nicht garantiert gewinnt. Für Skripte, die du selbst in der Hand hast, ist der deklarative Weg der verlässliche; die Musterblockade ist das Auffangnetz für alles andere. Embeds — für eingebettete Inhalte mit sichtbarer Fläche, etwa ein Video oder eine Karte:
<iframe data-consented="youtube-embed" data-consented-src="https://www.youtube-nocookie.com/embed/XXXX" width="560" height="315" title="Videotitel"></iframe>
Kein src-Attribut, bis die Einwilligung vorliegt — data-consented benennt den Dienst direkt, data-consented-src trägt die eigentliche Adresse. Weil der Browser nie ein src sieht, gibt es hier kein Wettrennen: anders als bei der Musterblockade oben ist dieser Weg für Embeds durchgehend zuverlässig, nicht nur ein Auffangnetz.
// Warten, bis der Zustand bekannt ist Consented.ready(function (state) { if (state && state.services['google-analytics-4']) { startTracking(); } }); // Auf Änderungen reagieren Consented.on('change', function (state) { console.log(state); }); // Detailansicht öffnen — oder einfach data-consented-open ans Element Consented.openSettings(); // Nachweisführung Consented.getConsentId();
| Ereignis | Wann |
|---|---|
consented_ready | Runtime geladen, Zustand bekannt |
consented_update | Nach jeder Entscheidung des Besuchers |
Eine fertige Übersicht aller Dienste und Cookies deiner Property — für die Stelle in deiner Datenschutzerklärung, an der du nach Art. 13 DSGVO informieren musst. Zwei Zeilen, und sie hält sich selbst aktuell:
<div id="consented-cookie-declaration"></div> <script src="https://consented.eu/p/DEINE-PROPERTY-ID/cookies.js?lang=de"></script>
Das div ist optional: fehlt es, setzt sich die Erklärung genau dorthin, wo das script steht. Sie bringt sparsame eigene Formatierung mit, alles unter der Klasse consented-cd — dein CSS überschreibt sie. Mit ?lang= wählst du die Sprache; ohne Angabe gilt die Standardsprache der Property.
Dieselbe Erklärung gibt es als eigenständige Seite zum Verlinken und Drucken:
https://consented.eu/p/DEINE-PROPERTY-ID/cookies?lang=de
Beide entstehen aus dem veröffentlichten Stand deiner Property, nicht aus dem Arbeitsstand. Was du gerade bearbeitest, erscheint erst nach dem Veröffentlichen — so steht in deiner Datenschutzerklärung nie ein Dienst, den die Seite noch nicht lädt.
Jede Einwilligung bekommt eine ID, die dem Besucher in der Detailansicht angezeigt wird. Damit kann er ohne Konto Auskunft verlangen oder löschen lassen:
GET /api/v1/consent/{consentId}
DELETE /api/v1/consent/{consentId}
Oder komfortabel über die öffentliche Abfrageseite.