YouTube-Video in WordPress einbinden
Eine Adresse einfügen genügt meist schon. Diese Anleitung zeigt den schnellen Weg über oEmbed, den Umweg über den Embed-Code für Startzeit und Größe, und was Sie beim Datenschutz beachten müssen, bevor ein YouTube-Video auf Ihrer Seite lädt.
YouTube-Video einbinden: die Kurzfassung
WordPress erkennt YouTube-Adressen selbst. Das Verfahren heißt oEmbed und macht aus einer eingefügten Adresse einen fertigen Player, ohne dass Sie eine Zeile Code anfassen.
- Öffnen Sie das Video auf YouTube und kopieren Sie die Adresse aus der Adresszeile des Browsers.
- Gehen Sie in den Beitrag oder die Seite, in der das Video erscheinen soll.
- Fügen Sie die Adresse in eine eigene, ansonsten leere Zeile ein. Im Block-Editor wird daraus automatisch ein YouTube-Block, im klassischen Editor zeigt der visuelle Modus direkt eine Vorschau.
- Speichern und die Seite im Frontend prüfen.
Klappt das nicht, steht die Adresse fast immer mitten in einem Satz oder ist schon als Link formatiert. Entfernen Sie die Verlinkung und setzen Sie die Zeile frei.
Wer den Block gezielt einsetzen will, fügt über das Plus-Symbol den Block „YouTube“ ein und trägt die Adresse dort ein. Das Ergebnis ist dasselbe, nur der Weg ist expliziter.
Zwei Wege, ein Ergebnis
Adresse einfügen
Schnell, responsiv und ohne Code. Für die allermeisten Fälle die richtige Wahl.
Embed-Code einfügen
Nötig, sobald Sie Startzeit, Bedienelemente oder den Datenschutzmodus steuern wollen.
Den YouTube Embed-Code in WordPress einfügen
Den Einbettungscode holen Sie sich direkt bei YouTube. Klicken Sie unter dem Video auf „Teilen“ und dann auf „Einbetten“. YouTube zeigt einen iframe-Code, den Sie kopieren können. Darunter stehen Schalter für Startzeit, Bedienelemente und den erweiterten Datenschutzmodus.
Im Block-Editor fügen Sie den Code in einen Block vom Typ „Individuelles HTML“ ein. Im klassischen Editor wechseln Sie auf die Registerkarte „Text“ und setzen ihn an die gewünschte Stelle. Zurück im visuellen Modus sollte die Vorschau erscheinen.
So sieht der Code in seiner einfachsten Form aus:
<iframe width="560" height="315"
src="https://www.youtube.com/embed/VIDEO-ID"
title="YouTube video player" frameborder="0"
allowfullscreen></iframe>Die Video-ID ist die Zeichenfolge nach v= in der normalen YouTube-Adresse. Alles Weitere steuern Sie über Parameter, die Sie hinter der ID anhängen.
Nützliche Parameter
?start=90lässt das Video bei Sekunde 90 beginnen. Bei YouTube setzen Sie stattdessen einfach den Haken bei „Start bei“.?autoplay=1&mute=1startet automatisch. Ohnemute=1blockieren Browser den Start, weil Ton ohne Zutun des Nutzers unerwünscht ist.?rel=0beschränkt die Videovorschläge am Ende auf denselben Kanal.?controls=0blendet die Bedienleiste aus. Sinnvoll nur bei kurzen Schleifen, sonst nimmt es Besuchern die Kontrolle.
Größe, Seitenverhältnis und Ausrichtung
Der Embed-Block passt sich der Spaltenbreite an und behält dabei das Seitenverhältnis 16:9. Sie müssen nichts einstellen, das Video wird auf dem Smartphone automatisch schmaler.
Beim eingefügten iframe-Code ist das anders. Dort stehen feste Werte für Breite und Höhe, die auf schmalen Bildschirmen über den Inhaltsbereich hinausragen. Zwei Auswege gibt es: Entweder Sie nutzen doch den Block, oder Sie packen den iframe in einen Container, der die Breite auf hundert Prozent begrenzt und die Höhe daraus berechnet.
Zum Zentrieren markieren Sie den Block und wählen in der Werkzeugleiste die mittige Ausrichtung. Im klassischen Editor setzen Sie den Absatz mit dem Video auf zentriert. Bei einem Video, das die volle Spaltenbreite einnimmt, fällt der Unterschied allerdings nicht auf.
Playlist, Kanal und Shorts
Eine Playlist binden Sie genauso ein wie ein einzelnes Video: Adresse der Playlist kopieren, in eine eigene Zeile einfügen, fertig. Der Player zeigt dann die Titelliste und spielt der Reihe nach ab.
Ein ganzer Kanal lässt sich mit Bordmitteln nicht einbetten. Dafür brauchen Sie ein Galerie-Plugin, das die Videos über die YouTube-Schnittstelle abruft und als Raster darstellt. Solche Plugins benötigen in der Regel einen API-Schlüssel aus der Google Cloud Console.
Shorts verhalten sich wie normale Videos, ihre Adresse enthält allerdings /shorts/ statt watch?v=. Wird nichts eingebettet, ersetzen Sie diesen Teil durch watch?v= und fügen die Adresse erneut ein. Das Hochformat bleibt dabei erhalten.
YouTube-Videos DSGVO-konform einbinden
Sobald ein YouTube-Video im Frontend geladen wird, baut der Browser des Besuchers eine Verbindung zu Google auf. Dabei wird die IP-Adresse übertragen, und je nach Konstellation werden Cookies gesetzt. Das passiert, bevor jemand auf Play geklickt hat. In Deutschland brauchen Sie dafür eine Einwilligung.
Der erweiterte Datenschutzmodus
YouTube bietet beim Einbetten die Option „Erweiterten Datenschutzmodus aktivieren“. Der Code verweist dann auf die Domain youtube-nocookie.com. Das reduziert das Setzen von Cookies, verhindert die Verbindung zu Google-Servern aber nicht. Die Einwilligungspflicht entfällt dadurch nach verbreiteter Auffassung nicht.
Die Zwei-Klick-Lösung
Der praktikable Weg ist ein Content Blocker. Statt des Videos erscheint zunächst eine Platzhalterfläche mit einem kurzen Hinweis, wohin die Daten fließen. Erst nach dem Klick des Besuchers lädt das Video wirklich. Consent-Tools wie Borlabs Cookie oder Real Cookie Banner bringen fertige Blocker für YouTube und Vimeo mit und verknüpfen sie automatisch mit der Einwilligung im Cookie-Banner.
Ein Nebeneffekt lohnt die Mühe: Die Seite lädt schneller, weil das Player-Skript erst bei Bedarf geholt wird. Als Platzhalter können Sie ein eigenes Vorschaubild hinterlegen, das besser zum Seitendesign passt als das automatische Thumbnail von YouTube.
Wann ein YouTube-Plugin sinnvoll ist
Für ein einzelnes Video brauchen Sie kein Plugin. Interessant wird eine Erweiterung, sobald Sie mehrere Videos als Galerie zeigen, einen Kanal automatisch spiegeln oder den Player im eigenen Farbschema ausgeben wollen. Auch das Nachladen mit Vorschaubild statt Original-Thumbnail lösen manche Plugins eleganter als eine Handarbeit.
Bevor Sie eines installieren, gelten dieselben Prüfpunkte wie bei jeder Erweiterung: letzter Aktualisierungszeitpunkt, freigegebene WordPress-Version und Reaktionszeit im Support. Wie Sie das bewerten, steht bei den WordPress Sicherheits-Plugins im Abschnitt zur Plugin-Prüfung.
Und Vimeo?
Vimeo funktioniert nach demselben Muster. Adresse kopieren, in eine eigene Zeile einfügen, WordPress erzeugt den Player. Auch hier gibt es einen Einbettungscode mit Parametern, und auch hier gilt die Einwilligungspflicht, weil der Player von fremden Servern lädt. Wer zwischen den Plattformen schwankt: Vimeo ist zurückhaltender bei Werbung und Videovorschlägen, YouTube bringt dafür Reichweite mit.
Wenn das Video nicht erscheint
- Statt des Videos steht nur ein Link: Die Adresse teilt sich die Zeile mit anderem Text oder ist verlinkt. Formatierung entfernen, Zeile frei stellen.
- Eine Hinweisfläche statt des Players: Der Content Blocker Ihres Consent-Tools greift. Das ist gewollt, prüfen Sie die Darstellung im privaten Fenster.
- Das Video ragt seitlich heraus: Fester iframe-Code ohne responsive Anpassung. Auf den Embed-Block wechseln.
- Autoplay startet nicht: Der Parameter
mute=1fehlt. - Video nicht verfügbar: Der Kanal hat das Einbetten in den Videoeinstellungen untersagt. Daran lässt sich von außen nichts ändern.
Häufige Fragen
Adresse des Videos kopieren und in eine eigene, leere Zeile im Editor einfügen. WordPress baut daraus den Player. Für mehr Kontrolle nehmen Sie den Einbettungscode von YouTube und setzen ihn in einen HTML-Block.
Der Embed-Block ist von Haus aus responsive und behält das Seitenverhältnis bei. Nur ein direkt eingefügter iframe mit festen Pixelwerten braucht einen Container, der die Breite begrenzt. Der einfachste Weg ist deshalb, den Block zu verwenden.
Der erweiterte Datenschutzmodus über die Domain youtube-nocookie.com reduziert das Setzen von Cookies. Die Verbindung zu Google-Servern und damit die Übertragung der IP-Adresse bleibt bestehen. Vollständig vermeiden lässt sich das nur mit einer Zwei-Klick-Lösung oder indem Sie das Video selbst hosten.
Über den Einbettungscode geht das nicht, YouTube liefert das Thumbnail des Kanals aus. Ein eigenes Vorschaubild bekommen Sie über eine Zwei-Klick-Lösung oder ein Plugin, das einen Platzhalter anzeigt und das Video erst nach dem Klick nachlädt. Ist es Ihr eigenes Video, ändern Sie das Thumbnail direkt im YouTube Studio.
Browser blockieren automatisch startende Videos mit Ton. Ergänzen Sie den Parameter mute=1, dann läuft das Video stumm an. Auf Mobilgeräten kann Autoplay je nach Einstellung des Nutzers trotzdem unterbunden werden.
Weiterlesen
Überblick
Alle drei Wege im Vergleich: einbetten, hochladen oder per Plugin.
Videos sauber und rechtssicher einbinden
Wir richten Einbettung, Content Blocker und Consent-Tool so ein, dass Ihre Videos laufen und der Datenschutz stimmt.