YouTube Videos in WordPress einbinden: via HTML-Code, mit Elementor und Youtube Nocookie

In diesem Beitrag geht es darum, wie man mit HTML-Code – oder mit einem Editor wie dem Elementor – YouTube Videos mit der Option „Youtube Nocookie“ in WordPress einbinden kann. Bei dieser von YouTube selbst zur Verfügung gestellten Option geht es darum, Videos ohne Cookies auf Websites einbetten zu können, damit das YouTube-Video-Anschauen auf Websites „möglichst“ DSGVO-konform stattfinden kann. Aber Achtung: der Schein trügt, denn nur weil YouTube seine Option „YouTube Nocookie“ nennt, bzw. die Cookies von www.youtube-nocookie.com geladen werden, heißt es nicht, dass es keine Cookies gibt die geladen werden, speziell wenn man das Video abspielt.

youtube videos in wordpress nocookie

YouTube Video mit Nocookie-Option via HTML-Code in WordPress einbinden

In folgendem Abschnitt wird erklärt, wie man ein YouTube-Video ohne Cookies (www.youtube-nocookie.com) in WordPress einbetten kann. Doch muss ich darauf hinweisen, dass die reine Implementierung eines YouTube-Videos mit erweitertem Datenschutz (www.youtube-nocookie.com) nicht ausreicht um die DSGVO-Bestimmungen komplett zu erfüllen. Um wirklich DSGVO-konform YouTube-Videos in Websites direkt einzubinden, ist ein relativ aufwendiger technischer Vorgang notwendig, der zuerst das Laden des YouTube-Videos grundsätzlich unterbindet und nur durch eine aktive Einverständniserklärung des Users (Klick auf einen entsprechenden Button) das Video vom YouTube-Server ladet. Denn spätestens dann, sobald der User den Play-Button klickt, werden auch von youtube-nocookie.com Cookies geladen. Aber ist das wirklich so? Kann es sein, dass Cookies von youtube-nocookie.com bereits vor dem Abspielen von YouTube-Videos geladen werden? Auch mit dieser Frage habe ich mich folgend beschäftigt.

Anleitung um ein YouTube Video mit erweitertem Datenschutz via HTML in WordPress einzubinden

  1. Öffnen Sie das Video direkt in YouTube
  2. Klick auf Teilen-Button unterhalb des Videos – es öffnet sich ein Pop-Up
  3. Klick auf  Einbetten-Symbol (<>): Es öffnet sich ein neues Fenster im Pop-Up (Video einbetten)
  4. Hier nun unterhalb des Codes den Erweiterten Datenschutzmodus aktivieren„.
  5. Nun den von YouTube hier zur Verfügung gestellten Code in die Zwischenablage kopieren
  6. Den Code an der Stelle der WordPress-Website platzieren, wo das Video sein soll.

Unterschiede im Code:

YouTube Video Code ohne erweiterten Datenschutz:

<iframe width=“560″ height=“315″ src=“https://www.youtube.com/ embed/ code-des-videos“ title=“YouTube video player“ frameborder=“0″ allow=“accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share“ referrerpolicy=“strict-origin-when-cross-origin“ allowfullscreen></iframe>

YouTube Video Code mit erweiterten Datenschutz:

<iframe width=“560″ height=“315″ src=“https://www.youtube-nocookie.com/ embed/ code-des-videos“ title=“YouTube video player“ frameborder=“0″ allow=“accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share“ referrerpolicy=“strict-origin-when-cross-origin“ allowfullscreen></iframe>

Der Unterschied ist erkennbar. Es ändert sich die Domain im Code:

  • www.youtube.com: mit Cookies
  • www.youtube-nocookie.com: ohne Cookies (Achtung: Cookies werden spätestens dann geladen, wenn man den Play-Button klickt)
Wann Cookies bereits geladen werden könnten

Das Problem ist ja auch das Thumbnail des YouTube-Videos, welches bereits beim Erscheinen des Videos am Bildschirm / Screen / Display geladen wird um angezeigt werden zu können. Da hilft leider auch keine Lazy-Load-Funktion (die ein vorzeitiges Laden verhindert) um hier hundertprozentig DSGVO-konform zu sein. Es muss demnach eine Möglichkeit gefunden werden, die Website so zu gestalten, damit der User zuerst mit einer Aktion einwilligen muss, bevor das Video am Screen erscheint.

Fazit: diese Erklärungen hier sind in Summe höchstens „datenschutzfreundlich“ aber nicht hundertprozentig DSGVO-konform. Um wirklich ganz DSGVO-konform zu sein, ist ein entsprechender Consent für die Verwendung von YouTube-Videos erforderlich, der die User darüber aufklärt, was datenschutztechnisch passiert, wenn ein YouTube-Video im Spiel ist. Es gibt aber auch mit dem Elementor eine Lösung, die Abhilfe verschaffen könnte. Dazu später mehr. Nun beschäftigen wir uns mit der Charakteristik von youtube.com und youtube-nocookie.com.

Unterschied zwischen youtube.com und youtube-nocookie.com

Der Unterschied zwischen youtube.com und youtube-nocookie.com liegt hauptsächlich im Datenschutz und der Verwendung von Cookies.

youtube.com

  • Normale YouTube-Einbettung
  • Sobald ein Video eingebettet wird (auch wenn es noch nicht abgespielt wurde), werden Cookies gesetzt, u. a. für: Nutzer-Tracking, Personalisierte Werbung, Statistiken über das Nutzerverhalten
  • Dies kann datenschutzrechtlich problematisch sein, insbesondere nach der DSGVO.

youtube-nocookie.com

  • Datenschutzfreundlichere Einbettung
  • Gehört ebenfalls zu YouTube, aber es werden keine Cookies gesetzt, solange der Nutzer das Video nicht aktiv abspielt
  • Wird als „erweiterter Datenschutzmodus“ bezeichnet
  • Tracking ist deaktiviert, bis das Video aktiv gestartet wird

Wie man hier in der Gegenüberstellung sieht, hilft youtube-nocookie.com allerhöchstens dabei, datenschutz-freundlicher zu agieren, aber ohne den Consent (Einwilligung) des Users bleibt es rechtlich problematisch.

Wenn der erweiterte Datenschutz von YouTube nicht aktiviert ist:

Wenn der erweiterte Datenschutz von YouTube zum Einbinden in die Website nicht aktiviert ist (standardmäßig ist dies nicht aktiviert, man muss es manuell einstellen), dann sehen die geladenen Cookies im Code der Website so aus (Ansicht: Mozilla Firefox Webspeicher Console) wenn man die Seite öffnet:

youtube cookie

Wenn der erweiterte Datenschutz von YouTube aktiviert ist:

Wenn der erweiterte Datenschutz von YouTube zum Einbinden in die Website aktiviert ist, dann werden auf der Website (Ansicht: Mozilla Firefox Webspeicher Console) zunächst mal dazu keine Cookies geladen (Domain: www.youtube-nocookie.com + Lazy Load-Funktion), zumindest werden sie mit Mozilla Firefox nicht angezeigt:

youtube nocookie

Aber Achtung: Wenn man ein YouTube-Video mit erweitertem Datenschutz (youtube-nocookie.com) und der Lazy-Load-Funktion (wird erst geladen, wenn das Video am Screen erscheint, auch ohne Abspielen des Videos) am Bildschirm zu sehen bekommt, auch ohne es abzuspielen, dann werden durchaus schon Cookies geladen. Als Beweis dafür kann man sich das Szenario am besten mit Google Chrome ansehen:

youtube nocookies cookies geladen über google chrome
Abbildung: Geladene YouTube-Cookies via Google Chrome von youtube-nocookie.com / Domain: .google.com

Eigene Beobachtung:

Hier im Google Chrome Inspector (zu öffnen mit Taste F12) sieht man unter dem Reiter „App“ und Menüpunkt „Cookies“ die jeweils aktuell geladenen Cookies. Die hier angezeigten Cookies erscheinen bereits dann, wenn man lediglich zum Video hinscrollt. Das zeigt eigentlich, dass Cookies bereits vor dem Abspielen des Videos von youtube-nocookie.com geladen werden. Dies widerspricht der allgemeinen Behauptung, dass Cookies von youtube-nocookie.com erst dann geladen werden, wenn man das Video abspielt. Für mich sieht es so aus, als werden Cookies bereits geladen, wenn das Thumbnail (Vorschaubild) des Videos erscheint. Und die Domain der Cookies ist google.com (nicht youtube-nocookie.com). Bitte korrigieren Sie mich (gerne per E-Mail), wenn meine Vermutung / Beobachtung hier nicht korrekt ist.

YouTube Videos mit Elementor in WordPress ohne Cookies und mit Consent (Einwilligung)

Wie wir nun wissen, ist das Einbinden von YouTube-Videos in Websites ein richtig komplexes Thema und eigentlich DSGVO-konform gar nicht wirklich möglich. Da helfen auch die folgenden Möglichkeiten (Privater Modus und Lazy-Load) des Elementors leider nicht wirklich weiter. Aber dennoch finden Sie hier die Möglichkeiten mit dem Elementor:

Wenn man einen mächtigen Editor, wie den Elementor (mit dem Elementor kann man ohne Programmier-Kenntnisse viele Dinge tun) verwendet, dann kann man das grundelegende Video-Element (siehe Abbildung) des Elementors verwenden. Dazu muss man lediglich mit „drag and drop“ das Video-Element in den gewünschten Container „ziehen“. Und mit nur einer Einstellung (einem Klick) kann man die YouTube-Cookies entfernen, indem man den „Privaten Modus“ aktiviert:

elementor youtube videos privater modus

Im Prinzip wird nun „cookie-technisch“ ebenfalls (wie bei der oben angeführten HTML-Einbindungsvariante) von youtube.com auf youtube-nocookie.com gewechselt. Insofern kommt man mit dem Elementor datenschutz-technisch zum gleichen Ergebnis. Im Quellcode ergeben sich natürlich ein paar Unterschiede, diese sehen dann so aus:

elementor youtube videos
Abbildung: Elementor Video-Element (Widget)
elementor youtube html code
Abbildung: Einbinden mit HTML-Code
elementor youtube widget html code
Abbildung: Einbinden mit Video-Element (Widget)

YouTube Video mit Elementor-Widget DSGVO-konform in Website einbinden

Mit dem Elementor-Widget ist das YouTube-Video für responsive Einsätze (das Video skaliert besser mit der jeweiligen Display-Größe mit) besser geeignet, als wenn man lediglich den HTML-Code verwendet.

Lazy Load verwenden

Verwenden Sie auch die Option „Lazy Load„, welche versucht, genau so wie auch bei Bildern, erst dann Daten vom Videoserver zu übertragen wenn diese erst wirklich benötigt werden. Dies unterbindet gleich vorweg ein vorzeitiges Laden von youtube-nocookie.com.

Standard-Einstellungen für Video-Element anpassen

Äußerst praktisch ist die Elementor-Funktion „Als Standard speichern“. Damit kann man automatisch für alle zukünftigen YouTube-Videos, die man in die eigene Website einbinden will, den „Privaten Modus“ und „Lazy Load“ grundsätzlich standardisiert aktivieren, ohne dass man jedes Mal diese Optionen neu einstellen muss.

elementor widget einstellungen als standard speichern
Abbildung: im Pop-Up-Menü (rechte Maustaste) des jeweiligen Elements kann man die aktuellen Einstellungen als Standard übernehmen.

Verwendung des Elementor Akkordeon-Elements

Wenn Sie das YouTube-Video mit erweitertem Datenschutz und Lazy Load in einem Akkordeon „verstecken“, dann werden in der Tat erst Cookies geladen, wenn der User explizit das Akkordeon öffnet. Demnach muss der User eine bewusste Handlung durchführen (einen Klick machen), um das Laden der Cookies auszulösen. Sehen Sie dieses Beispiel:

YouTube Video mit Consent auf Website anzeigen

Wenn Sie diesen Button klicken, dann laden Sie ein YouTube-Video mit erweitertem Datenschutz (youtube-nocookie.com). Es werden beim Erscheinen des Videos (Vorschaubild), beziehungsweise beim Abspielen des Videos, Cookies (Domain: .google.com) geladen. Mit einem Klick auf den Button stimmen Sie ausdrücklich der Nutzung von YouTube-Cookies zu. Mehr Informationen erhalten Sie in unseren Datenschutzbestimmungen.

Sehen Sie hier am Beispiel von Google Chrome was mit den Cookies passiert, wenn das YouTube-Video hier angezeigt wird:

Im Prinzip ist dies nun eine Möglichkeit mit dem Elementor, damit Cookies von YouTube erst dann geladen werden, wenn der User auf den Consent-Button klickt und damit zustimmt, dass YouTube-Cookies geladen werden dürfen. Weitere Erklärungen dazu finden Sie auch hier:

Alle YouTube-Videos auf der eigenen Website finden

Wenn Sie das Problem haben, nicht zu wissen, welche YouTube-Videos wo auf Ihrer Website zu finden sind, dann kann Ihnen die Google-Suche eventuell weiter helfen. Verwenden Sie den Suchbegriff site:https://ihre-domain.at/ „youtube.com“ und Google listet Ihnen alle Seiten Ihrer Website auf, in welchen sich YouTube-Videos befinden. Bei unvollständiger Indexierung Ihrer Website kann es sein, dass nicht alle Seiten hier angeziegt werden, daher gibt es keine Garantie, dass Sie hier alle YouTube-Videos auf Ihrer Website finden.

Hinweis zum Datenschutz

In diesem Beitrag geht es nur bedingt um den datenschutzrechtlichen Aspekt von YouTube-Videos, sondern rein um das technische Implementieren in Websites, aber dennoch ein kleiner Tipp (es wird dafür keine Haftung übernommen) für die Datenschutzerklärung. Es sollte auf jeden Fall über die Verwendung von YouTube-Videos auf der jeweiligen Website aufgeklärt werden und die Möglichkeit für eine Zustimmung (Consent) vorhanden sein. Ein Mustertext dafür könnte lauten:

YouTube – Mustertext

Diese Website verwendet für die Einbindung von Videos den Anbieter YouTube LLC , 901 Cherry Avenue, San Bruno, CA 94066, USA, vertreten durch Google Inc., 1600 Amphitheatre Parkway, Mountain View, CA 94043, USA. Normalerweise wird bereits bei Aufruf einer Seite mit eingebetteten Videos Ihre IP-Adresse an YouTube gesendet und Cookies auf Ihrem Rechner installiert. Wir haben unsere YouTube-Videos jedoch mit dem erweiterten Datenschutzmodus eingebunden (in diesem Fall nimmt YouTube immer noch Kontakt zu dem Dienst Double Klick von Google auf, doch werden dabei laut der Datenschutzerklärung von Google personenbezogene Daten nicht ausgewertet). Dadurch werden von YouTube keine Informationen über die Besucher mehr gespeichert, es sei denn, sie sehen sich das Video an, beziehungsweise sehen bereits das Thumbnail (Vorschaubild des Videos). Wenn Sie das Video sehen, wird Ihre IP-Adresse an YouTube übermittelt und YouTube erfährt, dass Sie das Video angesehen haben. Sind Sie bei YouTube eingeloggt, wird diese Information auch Ihrem Benutzerkonto zugeordnet (dies können Sie verhindern, indem Sie sich vor dem Aufrufen des Videos bei YouTube ausloggen).

Von der dann möglichen Erhebung und Verwendung Ihrer Daten durch YouTube haben wir keine Kenntnis und darauf auch keinen Einfluss. Nähere Informationen können Sie der Datenschutzerklärung von YouTube unter policies.google.com entnehmen. Zudem verweisen wir für den generellen Umgang mit und die Deaktivierung von Cookies auf unsere allgemeine Darstellung in dieser Datenschutzerklärung.

Für diesen Mustertext und diese Hinweise wird keine Haftung übernommen!