Consentl auf Framer

Fügen Sie Consentl mit dem Custom Code „Start of <head> tag“ vor den Skripten von Framer ein und ersetzen Sie die Cookie-Banner-Komponente von Framer.

Loader als erstes im <head>: Hängt von der Methode ab

Kann der Loader als erstes im <head> stehen? Fast. Framer hat eine Platzierung „Start of <head> tag“, die den Loader vor die eigenen Skripte von Framer setzt; nur die Meta- und Charset-Tags von Framer stehen davor. Die Laufzeit von Framer ist ein <script type="module" async> im Body. Sie ist nicht verzögert, läuft aber trotzdem nach einem synchronen Loader am Anfang des <head>, weil der Loader in der Dokumentreihenfolge zuerst kommt. Damit kommt Framer unter den No-Code-Baukästen der empfohlenen Einrichtung am nächsten.

Voraussetzungen

Ein kostenpflichtiger Website-Tarif mit eigener Domain. Custom Code läuft nur auf der veröffentlichten Website.
Ihr Consentl-Website-Schlüssel, auf der Seite Einrichtung Ihrer Website im Dashboard. Tragen Sie den Hostnamen der Website im Feld Domains ein; www. und die Domain ohne www zählen als dieselbe Website, www. muss also nicht separat hinzugefügt werden.

Was Ihr Consentl-Tarif abdeckt

Free: Banner, Einwilligungsprotokoll und nur manuelle Blockierung.
Pro: ergänzt Google Consent Mode v2.
Business: ergänzt die automatische Blockierung bekannter Tracker und die Blockierungsregeln, die Sie im Dashboard hinzufügen.

In den Tarifen Free und Pro werden nur Tags zurückgehalten, die Sie manuell markieren.

Installation

Öffnen Sie im Framer-Projekt Project Settings → Custom Code und fügen Sie ein Snippet hinzu.
Fügen Sie ein:
```
<script src="https://api.consentl.com/v1/loader.js?k=SITE_KEY&l=en"></script>
```
Wenn die Website auch die Consentl-Vorlage für GTM verwendet, hängen Sie &gcm=ext an die URL an, damit nur die Vorlage Consent-Mode-Befehle sendet.
Placement: Start of <head> tag.
Pages: alle Seiten.
Run: Once. Framer navigiert clientseitig, und bei clientseitiger Navigation geht das Banner nicht verloren. „Run on every page visit“ würde den Loader bei jeder Navigation erneut einfügen. Halten Sie die Loader-URL auf jeder Seite identisch.
Entfernen Sie die Komponente Cookie Banner von Framer aus Ihren Seiten, falls Sie sie verwendet haben. Es sollte nur ein Banner aktiv sein.
- Die Komponente Cookie Banner hat auch die Default- und Update-Aufrufe von Google Consent Mode gesendet. Wenn Ihre GTM- oder Google-Tags darauf angewiesen waren, ersetzt der Consent Mode von Consentl sie ab dem Tarif Pro.
- Im Tarif Free gibt es nach dem Entfernen der Komponente keine Consent-Mode-Aufrufe. Markieren Sie das Snippet von GTM oder des Google-Tags manuell (<script type="text/plain" data-consentl="analytics">…</script>, mit der Kategorie, die zu dem passt, was es lädt), damit es erst nach der Einwilligung läuft.
Publish.
Optional: Fügen Sie der Footer-Komponente einen Link mit der URL #consentl („Cookie-Einstellungen“) hinzu. Links, deren URL auf #consentl oder #consentl-preferences endet, und jedes Element mit dem Attribut data-consentl-open öffnen die Einstellungen.

Prüfen, ob es funktioniert

Testen Sie die Live-Website in einem privaten Fenster. Custom Code läuft weder im Canvas noch in der Vorschau.

Die Region des Besuchers ergibt sich aus seiner IP-Adresse: Consentl ermittelt das Land bei jedem Seitenaufruf im Arbeitsspeicher (nichts wird gespeichert) und wendet Ihre Dashboard-Regel dafür an. US-Bundesstaaten werden nicht unterschieden: Besucher aus den USA erhalten Ihre Regel für die gesamten USA oder, ohne eine solche, Ihre erste Regel für einen US-Bundesstaat. Ein unbekanntes Land erhält Ihre Regel für unbekannte Regionen (standardmäßig Opt-in).

Sprachen

Die Locales von Framer teilen sich den websiteweiten Custom Code. Lassen Sie &l=… weg, um die Standardsprache aus dem Dashboard zu verwenden, oder fügen Sie das Snippet pro Seite oder Locale unter Page settings → Custom Code hinzu und halten Sie die URL auf jeder Seite einer Locale identisch.

Verwenden Sie auf Ihrer Seite mit der Cookie-Richtlinie eine Embed-Komponente (HTML):

<div data-consentl-declaration data-api="https://api.consentl.com" data-key="SITE_KEY" data-locale="en"></div>
<script src="https://api.consentl.com/v1/blocks.js" defer></script>

Verwenden Sie stattdessen data-consentl-request oder data-consentl-withdrawal für das Formular für Datenschutzanfragen oder das EU-Widerrufsformular. Das Widerrufsformular erfordert den Tarif Pro oder höher und muss im Dashboard aktiviert werden; andernfalls bleibt es leer.
Framer gibt die Embed-Komponente als HTML-Einbettung aus. Prüfen Sie auf der veröffentlichten Website, dass die Tabelle erscheint.
Falls nicht, verlinken Sie stattdessen die gehostete Cookie-Erklärung: https://api.consentl.com/p/SITE_KEY/cookies (eine öffentliche Seite, immer synchron mit dem Dashboard; hängen Sie ?l=de für eine andere Sprache an).

Einschränkungen

Die eigenen Meta- und Charset-Tags von Framer stehen weiterhin vor dem Snippet. Sie sind harmlos.
Framer Analytics ist cookielos und wird von Framer geladen; Consentl steuert es nicht.
Tracking-Integrationen unter Project Settings (Integrations), etwa Google Analytics, werden von Framer eingefügt und werden von Consentl möglicherweise nicht blockiert. Binden Sie Google-Tags vorzugsweise über GTM oder als Custom Code nach dem Consentl-Snippet ein. Consentl hält erkannte Tracker zurück, die nach ihm geladen werden (ab Tarif Business); in den Tarifen Free und Pro werden nur manuell markierte Tags zurückgehalten.
Fest eingetragene Tags. Ein <script src>, <img>-Pixel oder <iframe>, das in Custom Code oder einem Embed steht, wird vom Browser abgerufen, bevor ein Skript es aufhalten kann, auch wenn Consentl seine Ausführung verhindert. Markieren Sie solche Tags manuell und entfernen Sie <noscript>-Pixel:
```
<script type="text/plain" data-consentl="marketing" src="https://ads.example.com/tag.js"></script>
<iframe data-consentl="marketing" data-src="https://www.youtube-nocookie.com/embed/ID" title="Video"></iframe>
<img data-consentl="marketing" data-src="https://tracker.example.com/pixel.gif" alt="" width="1" height="1">
```
Per Code geladene Tags (GTM, der JavaScript-Loader eines Pixels) werden ohne Anfrage zurückgehalten, wenn die automatische Blockierung aktiv ist.

Kommen Sie nicht weiter? Schreiben Sie an support@consentl.com – wir antworten an Werktagen auf Englisch.