WordPress Cookie Banner + Consent Mode einrichten (Cookiebot Tutorial)

In diesem Video zeige ich dir wie du für deine WordPress Webseite einen Cookie Banner erstellst und einrichtest. Ich werde dafür Cookiebot benutzen das ist weltweit einer der größten Anbieter dafür und wenn deine Webseite unter 50 Seiten hat kannst du Cookiebot sogar dauerhaft kostenlos nutzen. Wenn du dir unsicher bist, ob du dich für den kostenlosen Tarif qualifizierst kannst du dich auch erstmal ganz normal bei Cookiebot anmelden, deine Domain wird dann automatisch gescannt und dann kannst du hier erkennen ob dein Webseite über oder unter 50 Seiten hat. Die Installation ist auch total einfach es gibt nämlich ein Plugin dass du verwenden kannst und über das Plugin hast du auch noch die Möglichkeit direkt den Google Tag Manager und auch den Google Consent Mode zu verwenden. Das Design von dem Cookie Banner kannst du natürlich auch individuell anpassen. Hier hat ein Nutzer dann die Möglichkeit verschiedene Cookie Gruppen zu akzeptieren und dementsprechend werden dann natürlich auch erst die ganzen Tracking Codes ausgelöst. Die kannst du alle über den Tag Manager konfigurieren. Dafür musst du einfach nur einen passenden Trigger erstellen und damit das ganze Tracking auch datenschutzkonform ist musst du noch eine zusätzliche Einwilligung bei deinen Tracking Codes hinzufügen. Wie das alles funktioniert das zeige ich dir jetzt in diesem Video, deshalb gibt dem Video auf jeden Fall einen Daumen nach oben wenn du etwas Neues lernen kannst ich wünsche dir jetzt ganz viel Spaß beim Zuschauen und los geht's. Zuerst musst du ein Cookiebot Konto erstellen indem du oben rechts auf den Button kostenlose Testversion klickst und den Link dazu findest du auch noch mal unten in der Videobeschreibung für die Anmeldung kannst Du entweder eine E-Mailadresse verwenden ein Google Konto oder ein Microsoft Konto ich werde in diesem Video eine E-Mailadresse verwenden bestätige das kurz und dann musst du als nächstes auch noch ein Passwort festlegen die E-Mailadresse musst du kurz bestätigen und anschließend kannst du dich in deinem cookibboard Konto anmelden in dem nächsten Schritt kannst du direkt deinen Banner schon konfigurieren indem du deine Domain einträgst und als Template auch Europa auswählst theoretisch kannst du diesen Schritt auch überspringen wenn Du möchtest aber du musst das später sowieso machen um den Cookie Banner auch zu installieren deswegen kannst du das auch jetzt am besten schon direkt machen ich trage hier kurz meinen Domainnamen ein bestätige das indem ich oben rechts auf Next klicke und dann kannst du noch das Design von deinem Cookie Banner anpassen auf der rechten Seite findest du eine Vorschau du kannst den Cookie Banner z.B in dem unteren Bereich platzieren oder in der Mitte du kannst das Design anpassen hier kannst du die Farbeinstellung ändern und auch die buttonfarbe anpassen in der bezahlten Version kannst du auch das Logo entfernen und unter Compliance kannst du auch noch die Länder auswählen aber wenn du hier vorher schon Europa ausgewählt hast dann musst du da nichts mehr anpassen oben links in der Ecke findest du auch noch den Bereich Content hier solltest du die Sprache auf jeden Fall anpassen die musst du aber erstmal vorher hinzu fügen indem du hier z.B German auswählst danach wählst du in dem oberen Bereich Deutsch aus und dann kannst du auch die englische Sprache entfernen wenn das für dich nicht relevant ist der Inhalt wird dann automatisch übersetzt und wenn du möchtest kannst du hier natürlich auch noch den Text anpassen das kannst du auch alles später noch mal individuell einstellen der letzte Einstellungsbereich ist privacy hier hast du die Möglichkeit einen Trigger zu aktivieren der befindet sich dann immer unten links in der Ecke von deiner Webseite und wenn ein Nutzer hier draufklickt dann hat der Nutzer die Möglichkeit nachträglich die cookieinstellungen anzupassen und das ist eine Sache die du auf jeden Fall auf deiner Webseite brauchst theoretisch kannst du das ganze auch deaktivieren und dann einen Link in deinem Footer hinzufügen über den ein Nutzer die cookieinstellungen nachträglich ändern kann aber um das ganze zu vereinfachen kannst du diesen Trigger auch einfach aktiviert lassen das bestätigst du dann wieder über den Button oben rechts in der Ecke und dann werden hier ein paar Anleitungen angezeigt wie du den Cooky Banner auf deiner Webseite installieren kannst das kannst du auch erstmal überspringen und auf Finish oben rechts in der Ecke klicken und dann wirst du direkt in das Dashboard von cookibot weitergeleitet das ist aktuell auch nur in Englisch verfügbar du kannst die Spracheinstellungen hier nicht ändern aber es gibt auch gar nicht so viele Einstellungsmöglichkeiten die du in diesem Bereich vornehmen musst wichtig ist dass in diesem Bereich deine Domain hinterlegt ist wenn du das bei der Anmeldung schon direkt gemacht hast dann sollte die hier auch schon auftauchen und dann siehst du auch direkt wie viele Seiten gescannt wurden und solange auf deiner Webseite unter 50 Seiten angezeigt werden kannst du cookieboard auch dauerhaft kostenlos nutzen deine Webseite wird automatisch einmal pro Monat gescannt dann wird geguckt welche Cookies sich auf der Webseite befinden und dann wird das auch automatisch angepasst du kannst do auf den kleinen pile unten rechts in der Ecke klicken und dann hast du die Möglichkeit den Scan auch manuell durchzuführen in diesem Bereich findest du auch eine Übersicht von deinen Cookies und kannst dann individuell noch Änderungen vornehmen unter der Konfiguration kannst du das Design und das Layout von deinen Cookie Banner noch mal nachträglich anpassen hier sind wieder genau die gleichen Einstellungsmöglichkeiten die ich dir vorher schon gezeigt habe und dann gibt es hier auch noch die Implementierung hier findest Du z.B deine Domain Group ID das ist eine ganz wichtige Nummer die Du auch gleich brauchst um den Cookie Banner in WordPress zu installieren dafür öffnest du den Backend Bereich von deiner WordPress Webseite klickst auf Plugins und wählst neues Plugin hinzufügen aus oben rechts in der Ecke suchst du dann nach cookiebot das Plugin ist von usercentrics dann klickst du auf Installieren und kannst das Plugin auch im Anschluss direkt aktivieren wenn du die Seite dann noch mal aktualisierst dann sollte auf der linken Seite auch der Arbeitsbereich von cookieard auftauchen und wenn du auf die Einstellungen klickst kannst du deinen cookieanner konfigurieren das erste was du machen musst ist du musst hier deine domainroup ID hinzufügen die findest du wieder in cookiebot die kannst du dir einfach herauskopieren und dann hier einfügen damit wird der cookieanner dann auch direkt auf deiner Seite aktiviert ich kann die Seite auch einmal ganz kurz öffnen und hier wird aktuell noch kein Cookie Banner angezeigt deswegen gehe ich hier noch mal ganz kurz zurück passe die Sprache noch an hier sollst du natürlich Deutsch auswählen weiter unten kannst du dann auch noch den Cookie blockierungsmodus auswählen hier würde ich dir auf jeden Fall empfehlen die manuelle Blockierung auszuwählen und nicht die automatische Blockierung die manuelle Blockierung die funktioniert einfach deutlich besser und da passieren auch weniger Fehler und wie du das alles richtig konfigurierst das werde ich dir auch in diesem Video zeigen diese Änderungen die speicherst du dann oben rechts in der Ecke ab und dann hast du cookibot auch schon auf deiner Seite installiert wenn ich die Seite jetzt noch mal aktualisiere dann wird der Cookie Banner hier jetzt angezeigt und dann hat ein Nutzer die Möglichkeit die verschiedenen Cookie grruppen auszuwählen es gibt in cookibard auch noch ein paar weitere Einstellungsmöglichkeiten z.B wenn du den Google TCH Manager verwenden möchtest das würde ich dir auf jeden Fall empfehlen wenn du das Tracking für deine Webseite einrichten möchtest also z.B Google Analytics den Facebook Pixel oder auch das Google Ads Conversion Tracking am einfachsten ist es das alles direkt über cookiebot zu konfigurieren deswegen ist es wirklich ganz wichtig dass der Google TEAG Manager auch noch nicht auf deiner Seite installiert ist natürlich brauchst du dafür auch ein Google TEAG Manager Konto ich habe für diese Webseite auch schon ein teagmanager Konto in diesem Konto befinden sich ein paar Tracking Codes z.B für den Facebook Pixel für Google Analytics 4 und auch für Google Ads und wie du so ein Tracking Setup datenschutzkonform mit dem Cookie Banner einrichtest das zeige ich dir als nächstes zuerst musst du dafür den Google Tech Manager aktivieren und anschließend auch deine Google Tech Manager ID hier eintragen die findest du in deinem Google TEAG Manager Konto oben rechts in der Ecke die kopierst du dir einfach kurz raus trägst die hier ein wenn du dein dat Layer unbenannt hast dann musst du das hier auch noch anpassen aber in den meisten Fällen kannst du das einfach überspringen wenn du auch nichts dran geändert hast in dem untersten Bereich wählst du auch noch die drei Cookie grruppen aus für die eine Einwilligung benötigt wird und dann speicherst du die Änderungen ab damit hast du den Google Tech Manager auf deiner Seite installiert aber ganz wichtig ist auch dass du den Google consent Mode auch noch verwendest damit kannst du ein datenschutzkonformes Tracking ziemlich einfach einrichten deswegen solltest du diesen Regler auf jeden Fall aktivieren und dann musst du ganz am Ende auch noch mal die cookiruppen auswählen und die Änderungen speichern viel musst du in WordPress nicht mehr anpassen als nächstes musst du in dem Google Tech Manager auch noch ein paar Änderungen vornehmen und das erste was du machen solltest ist auf die Verwaltung oben links in der Ecke zu klicken und unter den containereinstellungen die einwilligungsübersicht aktivieren die ist normalerweise nicht aktiviert deswegen musst du hier kurz den Haken setzen und das Ganze speichern und über die einwilligungsübersicht hast du die Möglichkeit den consent Mode zu konfigurieren als nächstes öffne ich den Vorschaumodus oben rechts in der Ecke weil du dir darüber genau anschauen kannst wie das Tracking aktuell funktioniert dafür musst du deinen Domainnamen hier eintragen deine Webseite öffnet sich dann in einem neuen Tab und Du kannst Dich hier ganz normal auf der Seite bewegen und in dem Tag assistant kannst du dann sehen welche Tracking Codes wann ausgelöst werden und ich sehe hier jetzt schon direkt dass Google Analytics 4 und auch der Facebook Pixel schon ausgelöst wird obwohl ich noch gar keinen Kent gegeben habe das sollte eigentlich erst passieren nachdem ich hier eine cookigruppe akzeptiert habe und die Auswahl dann auch bestätige das liegt daran dass ich in dem Google Tag Manager bei den ganzen Tags die falschen Trigger benutze hier muss ich einen Trigger benutzen der das ganze überprüft nachdem ich meine Einwilligung in dem Cookie Banner gegeben habe und wenn du vorher für WordPress eine andere Cookie Banner Lösung benutzt hast dann musst du deine Trigger wahrscheinlich auch noch anpassen in dem Tag assistant wird der Status auch immer angezeigt wenn du hier z.B auf der rechten Seite den Kent auswählst dann siehst du am Anfang dass die cookiegruppen automatisch am Anfang abgelehnt werden und ich habe auch noch keinen op-tin gemacht deswegen steht bei curent state auch überall denied und wenn ich jetzt in dem Cookie Banner auf alle zulassen klicke dann wieder zurück in den Tech assistant gehe dann gibt es hier ein Update das ist der Klick den ich gerade im Cookie Banner getätigt habe und hier wurde der current state auf granted gesetzt weil ich auch alle cookiruppen akzeptiert habe und erst dann sollte Google Analytics 4 und auch der Facebook Pixel ausgelöst werden damit das Ganze Tracking auch Daten schutzkonform ist das kannst du ändern indem du in dem Google Tag Manager einen Trigger für das Cookie consent Update Event erstellst dieses Event überprüft welche Cookie grruppen akzeptiert worden und dann werden auch dementsprechend die Tracking Codes ausgelöst ein Trigger für dieses Event kannst du erstellen indem du in dem Google TEAG Manager auf die Trigger klickst dann wählst du neu aus in der Trigger Konfiguration wählst du ein benutzerdeiniertes Ereignis aus und dann trägst du hier den Namen von diesem Event ein das kannst du dir einfach rauskopieren und dann in dem Google Tag Manager eintragen den Trigger kannst du genauso benennen wichtig ist dass auch alles genauso geschrieben ist also keine Großbuchstaben verwenden und dann speicherst du das ganze ab und diesen Trigger kannst du jetzt anstatt einen all pages Trigger verwenden weil aktuell ist es so dass auch alle Tracking Codes ausgelöst werden wenn ich die Einwilligung nicht akzeptiere z.B kann ich eine andere Seite aufrufen wenn ich dann den Text assistant wieder öffne und den letzten Seitenaufruf auswähle dann werden hier auch alle Tracking Codes ganz normal ausgelöst obwohl ich eigentlich die Cookies abgelehnt habe das kannst du anpassen indem du in dem Google TEAG Manager die Trigger für die Tracking Codes anpasst dafür klickst du einfach auf den Tracking Code unter Trigger klickst du auf den Stift auf das Minuszeichen und dann wählst du Cookie consent Update aus und speicherst das Ganze ab genau das gleiche wiederholst du z.B für den Facebook Pixel klickst wieder auf den Stift auf das Minuszeichen und wählst das Cookie consent Update Event aus für Google Analytics mache ich genau das gleiche klicke wieder auf den Stift auf das Minus und wähl das richtige Event aus Speicher das Ganze ab und wenn du ein Event benutzt für einen Trigger z.B ist das hier die danke Seite dann musst du dafür eine sogenannte triggergruppe erstellen das kannst du machen indem du den Tag auswählst dann den Trigger bearbeitest den bestehen Trigger löscht und dann musst du eine neue triggergruppe konfigurieren indem du oben rechts auf das Pluszeichen klickst hier willähst du ganz am Ende die triggergruppe aus klickst auf das Pluszeichen benutzt wieder das consent Update Event und klickst noch mal auf das Pluszeichen und wählst dann die danke Seite aus diesen Trigger nenne ich TG für triggergruppe consent plus danke Seite und Speicher das Ganze ab den Trigger musst du dann auch noch einmal speichern und dann machst du genau das gleiche für irgendwelche anderen Trigger z.B habe ich hier noch ein Event für Google Analytics hier kann ich den Trigger auch wieder anpassen und einen neuen Trigger hinzufügen hier kann ich tatsächlich die gleiche triggergruppe verwenden nämlich consent plus danke Seite hier steht jetzt Content das sollte eigentlich Kent heißen aber das ist jetzt auch egal das speicher ich einfach ab und wenn du dann den Vorschaumodus wieder von vorne startest die Verbindung bestätigst dann sollten die Tracking Codes auch nur ausgelöst werden nachdem ein Nutzer sein Einverständnis gegeben hat dafür gehe ich wieder auf die Seite klicke unten links auf die Einstellungen klicke auf Einstellungen ändern und klicke auf alle zulassen dann gehe ich noch mal auf die Kontaktseite und den letzten Seitenaufruf den kann ich mir dann hier auch wieder anschauen das scheint alles zu funktionieren genau das Gleiche kann ich dann auch noch mal überprüfen indem ich die Einwilligung wieder rufe dann wieder zurück auf die Startseite gehe und dann gucke ich mir den letzten Seitenaufruf wieder an und hier werden jetzt weiterhin alle Tracking Codes ausgelöst und das hängt mit dem Google Content Mode zusammen aktuell werden die Tracking Codes ausgelöst sobald das Cookie consent Update Event ausgelöst wird aber es wird z.B noch nicht der Kent überprüft und hier wurde alles abgelehnt und das bedeutet dass die Tracking Codes eigentlich auch nicht gefeuert werden sollten das kannst du alles über die einwilligungsübersicht in dem Google TEAG Manager konfigurieren deswegen war es auch so wichtig dass du die am Anfang aktivierst und wenn du das gemacht hast findest du in der TEAG über üersicht oben rechts in der Ecke ein Schild wenn du hier drauf klickst dann öffnet sich die einwilligungsübersicht und hier kannst Du sehen was dass bei allen Tracking Codes noch eine zusätzliche Einwilligung fehlt der Vorteil von dem Google consent Mode ist dass die ganzen Google Tracking Codes also z.B Google Analytics und auch das Google Ads Conversion Tracking schon eine integrierte Einwilligung haben das bedeutet dass du für diese Tracking Codes theoretisch keine zusätzliche Einwilligung hinzufügen musst für den Facebook Pixel musst du das aber auf jeden Fall machen deswegen klickst du am besten auf den Facebook Pixel und ganz unten in der taginstellung findest du die Einstellungen zur nutzereinwilligung hier musst du eine zusätzliche Einwilligung auswählen und wenn du den Facebook Pixel in der Statistik Cookie Gruppe hinzufügen möchtest dann wählst du Analytics storage aus oder in der Marketing Cookie Gruppe dann wählst du add storage aus das ganze speicherst du dann ab und bei den anderen Tracking Codes brauchst du theoretisch keine zusätzliche Einwilligung das kannst du auch noch einmal anpassen indem du alle Tracking kurz auswählst dann auf das Schild klickst und keine zusätzliche Einwilligung erforderlich auswählst und das ganze dann auch noch abspeicherst wenn ich dann wieder zurück in den Vorschaumodus gehe bzw den Vorschaumodus noch mal neu starte dann lädt die Seite wieder neu und jetzt wird Google Analytics 4 ausgelöst aber z.B nicht der Facebook Pixel obwohl ich eigentlich alle Tracking Codes abgelehnt habe der consent der ist überall noch denied und die Tracking Codes werden trotzdem ausgelöst weil aktuell der Conent Mode in der sogenannten advanced Version benutzt wird der Advanced Mode bedeutet dass Google Analytics 4 und auch das Google Ads Conversion Tracking automatisch ausgelöst werden bevor ein Nutzer seine einwieligung gegeben hat das ganze funktioniert über sogenannte cookieless Pings datenschutztechnisch ist das aber ein bisschen kritisch deswegen würde ich dir auch empfehlen das nicht zu benutzen wie du das alles konfigurierst das werde ich dir auch sofort zeigen vorher will ich das Tracking noch mal kurz überprüfen und die Einwilligung ändern bzw alle Cookies zulassen und wenn ich dann noch mal auf die Kontaktseite gehe und mir den letzten Seitenaufruf anschaue dann wird hier der Facebook Pixel auch gefeuert weil jetzt habe ich alle Cookie Gruppen akzeptiert der current state ist überall auf granted eingestellt und wenn ich mir das Event auf der letzten Seite anschaue dann wird hier der Facebook Pixel ganz normal getrackt und bei dem Seitenaufruf vorher da wurde der Facebook Pixel blockiert weil ich hier z.B ad storage also die Marketing Cookie Gruppe nicht akzeptiert hatte wie gesagt das ist der Advanced Mode von dem Google consent Mode und den basic Mode kannst du ein ichten indem du für die ganzen Google Tracking Codes auch eine zusätzliche Einwilligung hinterlegst das kannst du machen indem du unter den Text wieder das Schildsymbol auswählst für die Google Analytics 4 Tracking Codes kannst du dann z.B als zusätzliche Einwilligung Analytics storage auswählen das ganze speichern und das noch mal bestätigen und für die Google Ads Tracking Codes benutzt du ad storage weil sich diese Tracking Codes in der Marketing Cookie Gruppe befinden dann öffne ich den Vorschaumodus noch mal von vorne indem ich den alten Vorschaumodus schließe dann wieder die Verbindung herstelle und wenn ich jetzt den Tag assistant öffne dann wird hier auch kein Tracking Code ausgelöst die Cookie Einstellungen kann ich auch noch mal ändern indem ich z.B alle cookiruppen zulasse dann auf die Kontaktseite gehe und wenn ich dann wieder in den Tech assistant gehe dann wird hier der Facebook Pixel und auch Google Analytics ganz normal ausgelöst und bei dem Seitenaufruf vorher wenn ich hier das erste Cookie consent Update Event auswähle dann werden hier auch die Tracking Codes angezeigt die von den consent Einstellungen blockiert wordden also Google Analytics 4 der Facebook Pixel und auch die Conversion Verknüpfung bzw der Conversion linker ich hoffe das war soweit verständlich ich würde dir auf jeden Fall empfehlen den basic Mode von dem Google consent Mode zu verwenden dafür musst du in dem Google Tech Manager einen Trigger für das Cookie consent Update Event Erstellen dieses Event benutzt du dann einfach als all pages Trigger und wenn du ein Event oder eine Conversion tracken möchtest dann benutzt du dafür eine triggergruppe und in der triggergruppe fügst du dann auch wieder das Cookie consent Update Event hinzu und einen weiteren Trigger der die Conversion oder das Event auslösen soll den basic und den Advanced Mode den kannst du dann immer konfigurieren indem du auf das Schildsymbol klickst für alle Tracking Codes die nicht von Google sind musst du eine zusätzliche Einwilligung auf jeden Fall hinzufügen ganz egal ob du den Advanced oder den basic Mode verwend möchtest bei dem Advanced Mode kannst du die Google Tex ignorieren da musst du nichts anpassen aber wie gesagt ich würde dir davon abraten und den basic Mode den kannst Du verwenden indem du bei den Google Tex dann auch noch die zusätzliche Einwilligung nachträglich hinzufügst