Wie füge ich das Termly-Einwilligungsbanner zu meiner Homepage-Baukasten-Website hinzu?

Mit dem Termly-Add-on können Sie Ihr Einwilligungsbanner aktualisieren, seine Einstellungen und sein Erscheinungsbild anpassen und auf viele weitere nützliche Funktionen zugreifen, die Ihrer Website helfen können, die Datenschutzgesetze einzuhalten.

Im Folgenden gehen wir die Schritte durch, wie Sie das aktualisierte Einwilligungsbanner mithilfe der Code-Komponente zu Ihrer Homepage-Baukasten-Website hinzufügen.

Möchten Sie stattdessen ein Video ansehen?
Wir haben ein Schritt-für-Schritt-Video-Tutorial (auf Englisch) zur Verwendung des Termly-Dashboards und zum Hinzufügen des Einwilligungsbanners zu Ihrer Homepage-Baukasten-Website: auf YouTube ansehen.

• Bevor Sie beginnen
• Schritt 1 – Deaktivieren Sie das Einwilligungsbanner im Homepage-Baukasten-Dashboard
• Schritt 2 – Melden Sie sich beim Termly-Dashboard an
• Schritt 3 – Scannen Sie Ihre Website nach Cookies
• Schritt 4 – Passen Sie Ihr Einwilligungsbanner an
• Schritt 5 – Kopieren Sie den HTML-Code des Einwilligungsbanners
• Schritt 6 – Wählen Sie die Code-Komponente im Homepage-Baukasten
• Schritt 7 – Betten Sie den Einwilligungsbanner-Code in Ihre Website ein
• Schritt 8 – Ändern Sie die Einstellungen der Code-Komponente
• Schritt 9 – Betten Sie den Preference-Center-Code in Ihre Website ein
• Schritt 10 – Passen Sie die Platzierung und das Styling Ihres Preference-Center-Links an
• Schritt 11 – Speichern und veröffentlichen Sie Ihre Website

Bevor Sie beginnen

Um das aktualisierte Einwilligungsbanner zu Ihrer Homepage-Baukasten-Website hinzuzufügen, benötigen Sie ein Termly Abonnement und Zugriff auf die Code-Komponente des Homepage-Baukastens. Die Code-Komponente ist im Homepage-Baukasten Premium- und Business + E-Commerce-Paket enthalten. 

Schritt 1 – Deaktivieren Sie das Einwilligungsbanner im Homepage-Baukasten-Dashboard

Wenn Sie bereits das Basic-Einwilligungsbanner des Homepage-Baukastens verwenden (das ebenfalls von Termly bereitgestellt wird), deaktivieren Sie es, bevor Sie das aktualisierte Einwilligungsbanner in Ihre Website einbetten.

1. Öffnen Sie Ihr Homepage-Baukasten-Dashboard über das one.com Kontrollpanel.
2. Klicken Sie auf Website-Einstellungen und wählen Sie im linken Menü Einwilligungsbanner aus.
3. Stellen Sie sicher, dass das Einwilligungsbanner nicht aktiviert ist. Der Schalter sollte grau angezeigt werden. Falls das Einwilligungsbanner aktiv ist, deaktivieren Sie es durch Klicken auf den Schalter.
4. Veröffentlichen Sie Ihre Website.

#step-2Schritt 2 – Melden Sie sich beim Termly-Dashboard an

1. Melden Sie sich beim one.com Kontrollpanel an und klicken Sie unter Erweiterte Einstellungen auf Termly.

   

2. Klicken Sie auf den blauen Button Zu Termly gehen. Wenn Sie noch kein Termly-Abonnement haben, können Sie es auf dieser Seite erwerben.

   

3. Geben Sie Ihre E-Mail-Adresse und Ihr Termly-Passwort ein und klicken Sie auf den Anmelden Button, um sich beim Termly-Dashboard anzumelden.

Schritt 3 - Scannen Sie Ihre Website nach Cookies

1. Klicken Sie im Termly-Dashboard im linken Menü auf Einwilligungsverwaltung > Cookies.
2. Klicken Sie auf Jetzt scannen.

Schritt 4 – Passen Sie Ihr Einwilligungsbanner an

1. Klicken Sie im linken Menü auf Einwilligungsverwaltung > Einwilligungsbanner. Auf dieser Seite können Sie die Einstellungen und das Erscheinungsbild Ihres Banners anpassen.
2. Wenn Sie fertig sind, klicken Sie unten auf der Seite auf Speichern.

Weitere Informationen zu den Anpassungsoptionen finden Sie in unserem Leitfaden.

Schritt 5 – Kopieren Sie den HTML-Code des Einwilligungsbanners

1. Klicken Sie auf der Seite „Einwilligungsbanner“ oben auf den Installieren-Button.
2. Im sich öffnenden Popup-Fenster sehen Sie den Status des Cookie-Scans und die nächsten Schritte zur Installation des Banners. Klicken Sie unter Schritt 2 auf Einbetten.
3. Klicken Sie im nächsten Fenster auf Einfaches HTML.
4. Sie sehen nun das Skript, das zur Code-Komponente des Homepage-Baukastens hinzugefügt werden soll. Sie können außerdem auswählen, ob Sie die Auto Blocker-Funktion aktivieren möchten. Kopieren Sie den Code, indem Sie auf In die Zwischenablage kopieren klicken.

Schritt 6 – Wählen Sie die Code-Komponente im Homepage-Baukasten

1. Gehen Sie zu Ihrem Homepage-Baukasten-Editor.
2. Klicken Sie im Menü links auf Mehr und wählen Sie Code aus.

Schritt 7 – Betten Sie den Einwilligungsbanner-Code in Ihre Website ein

1. Wählen Sie im Popup-Fenster Vor dem Schließen </head> als Platzierung des Codes aus.
2. Fügen Sie das Skript des Einwilligungsbanners in das Feld ein und klicken Sie auf Speichern.

Schritt 8 – Ändern Sie die Einstellungen der Code-Komponente

1. Sie können die Code-Komponente jetzt oben auf Ihrer Seite im Editor sehen. Klicken Sie darauf, um die Einstellungen zu öffnen.
2. Klicken Sie in den Einstellungen der Code-Komponente auf Platzierung und aktivieren Sie das Kontrollkästchen Auf alle Seiten anwenden, damit das Einwilligungsbanner auf allen Seiten Ihrer Website angezeigt werden kann.

Schritt 9 – Betten Sie den Preference-Center-Code in Ihre Website ein

Zusätzlich zum Einwilligungsbanner empfehlen wir, einen Preference-Center-Link auf Ihrer Website einzufügen. Durch Anklicken dieses Links können Ihre Besucher ihre Cookie-Einstellungen ändern.

1. Erstellen Sie im Homepage-Baukasten-Editor eine weitere Code-Komponente, indem Sie im linken Menü auf Mehr und dann Code klicken.

2. Wählen Sie im Popup Normal als Codeplatzierung.

3. Kopieren Sie den folgenden Code, fügen Sie ihn in das Feld ein und klicken Sie auf Speichern:

<a href="#" class="termly-display-preferences" style="color:#000000;">Consent Preferences</a>

Schritt 10 – Passen Sie die Platzierung und das Styling Ihres Preference-Center-Links an

1. Ziehen Sie die Codekomponente des Preference Centers an die Stelle auf Ihrer Website, an der Sie den Link platzieren möchten. Wir empfehlen, sie in der Fußzeile zu platzieren, da sie dann auf allen Seiten sichtbar ist.

2. Sie können das Erscheinungsbild des Links ändern, indem Sie dessen Code mit CSS-Stilen anpassen. Klicken Sie auf die Code-Komponente, wählen Sie Bearbeiten und fügen Sie die gewünschten CSS-Stile hinzu.
   Im folgenden Beispiel haben wir die Farbe des Links auf Schwarz eingestellt und die Unterstreichung entfernt:

<a href="#" class="termly-display-preferences" style="color:#000000; text-decoration: none;">Consent Preferences</a>

Schritt 11 – Speichern und veröffentlichen Sie Ihre Website

Speichern Sie und veröffentlichen Sie Ihre Website, um die Änderungen online sichtbar zu machen.

Um zu überprüfen, ob Ihr Einwilligungsbanner funktioniert, öffnen Sie Ihre Website im Inkognito-Modus. Wenn Sie das Einwilligungsbanner nicht sehen, löschen Sie Ihre Cookies und überprüfen Sie, ob Sie alle oben genannten Schritte ausgeführt haben.

Verwandte Artikel:

• Erste Schritte mit Termly
• Benötige ich ein Einwilligungsbanner auf meiner Website?