So bette ich ein responsives YouTube-Video in WordPress ein (ohne Code)

In meiner langjährigen Erfahrung mit Online-Marketing habe ich gesehen, wie effektiv das Hinzufügen von YouTube-Inhalten sein kann, wenn es um die Förderung Ihrer Marke geht.

Wenn du die richtigen YouTube-Videos auswählst, kannst du sie zeigen:

• Bewerben Sie Ihre Videos und erhalten Sie mehr Aufrufe, Likes und Abonnenten für Ihren Kanal
• Zeigen Sie positive Bewertungen und Produktdemonstrationen, um Ihren Umsatz direkt zu steigern
• Die Besucher bleiben länger auf Ihrer Website, was sich positiv auf Ihre Suchmaschinenoptimierung auswirkt.

Aber heutzutage ist die Mehrheit der Internetnutzer mit dem Handy unterwegs. Und wenn Ihre Videos auf mobilen Geräten nicht geladen werden, haben Sie es schwerer, die Leute bei der Stange zu halten.

Hier kommen responsive Videos ins Spiel. Diese Videos passen sich automatisch an jede Bildschirmgröße an, egal ob es sich um ein Telefon, ein Tablet oder einen Computer handelt, damit jeder ein gutes Seherlebnis hat.

In diesem Artikel zeige ich Ihnen eine einfache Methode zum Einbetten von YouTube-Videos, die auf jedem Gerät gut aussehen.

In diesem Artikel

Möglichkeiten zum Einbetten responsiver YouTube-Videos

Schauen wir uns alle Möglichkeiten an, wie Sie YouTube-Videos zu WordPress hinzufügen können:

• Manuell: Kopieren Sie den Einbettungscode eines YouTube-Videos, fügen Sie ihn in Ihre Website ein und bearbeiten Sie die Codeschnipsel manuell, um Ihr Video responsiv zu machen.
• Automatisch: Lassen Sie ein WordPress-Plugin die Videos automatisch abrufen und zu Ihrer Website hinzufügen, damit sie sofort responsive ist.

Die erste Methode kann funktionieren, allerdings nur unter bestimmten Bedingungen. Erstens müssen Sie mit dem Einfügen und Ändern von Codefragmenten vertraut sein.

Zweitens müssen Sie bereit sein, die Zeit und den Aufwand aufzubringen, die erforderlich sind, um Einbettungscodes zu erstellen und sie wiederholt zu optimieren und in WordPress einzufügen.

Auf lange Sicht können diese Probleme wirklich einen hohen Preis verlangen. Außerdem kann das Fehlen eines Support-Teams zu einem großen Problem werden, wenn beim Einfügen des Codes etwas schief geht.

Der einfachere Weg ist, sich ein gutes WordPress-Plugin zuzulegen und es die Arbeit für Sie erledigen zu lassen, damit Sie sich auf wichtigere Dinge konzentrieren können.

Von allen Optionen auf dem Markt habe ich mich aus mehreren Gründen für YouTube Feed Pro entschieden.

Mit diesem Tool werden Ihre YouTube-Videos garantiert auf jedem Gerät, von Smartphones und Tablets bis hin zu Desktops, einwandfrei angezeigt - und das sofort nach der Installation.

Ich war auch überrascht, wie einfach es zu bedienen ist. Man kann einfach einem geführten Ablauf folgen und das Plugin führt einen durch den Prozess der Erstellung, Anpassung und Einbettung von YouTube-Video-Feeds.

Hier sind ein paar weitere Highlights, die mir bei der Verwendung von YouTube Feed Pro aufgefallen sind:

• Zeigen Sie Ihren YouTube-Kanal, Wiedergabelisten und sogar Livestreams in verschiedenen Layouts an
• Passen Sie das Aussehen Ihrer Videos mit einem Live-Editor an
• Moderieren Sie Ihren Feed und kontrollieren Sie, welche Videos auf Ihrer Website angezeigt werden
• Fügen Sie in nur 3 einfachen Schritten mehrere YouTube-Videos zu WordPress hinzu
• Erstellen Sie benutzerdefinierte YouTube-Feeds mit erweiterten YouTube-Suchanfragen
• Stellen Sie sicher, dass Ihre Website superschnell lädt, auch wenn Sie viele Videos einbetten

Alles in allem ist es ein sehr nützliches Tool, das Ihnen die Arbeit mit dem Code erspart.

Wenn du dieses Tool selbst ausprobieren möchtest, kannst du hier mit YouTube Feed Pro loslegen.

Die einfachste Art, responsive Videos einzubetten

Jetzt zeige ich Ihnen, wie Sie das Plugin verwenden können, um YouTube-Videos hinzuzufügen, die auf allen Bildschirmgrößen perfekt funktionieren.

Folgen Sie einfach den nachstehenden Schritten:

Schritt 1: Füge YouTube Feed Pro zu deiner Website hinzu

Beginnen Sie damit, dass Sie sich hier eine Kopie des YouTube Feed Pro Plugins besorgen.

Sobald Sie das Tool heruntergeladen haben, können Sie es auf Ihrer Website installieren.

Tipp für Anfänger: Sie können diese Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins befolgen, um weitere Anleitungen zu erhalten.

Schritt 2: Verwenden Sie das Plugin, um einen YouTube-Feed zu erstellen

Als Nächstes klicken Sie auf das Menü YouTube-Feed " Alle Feeds, das Sie in Ihrem WordPress-Dashboard finden können.

Wählen Sie die Option Neu hinzufügen , um mit dem Einbetten Ihrer YouTube-Videos zu beginnen.

Mit dem Plugin können Sie aus verschiedenen Feed-Typen wählen, die über die Quelle Ihrer YouTube-Videos entscheiden.

Unabhängig davon, welchen Feed-Typ Sie wählen, macht das Plugin Ihre Videos automatisch responsive, sodass sie auf jedem Gerät und jeder Bildschirmgröße gut aussehen.

Im Folgenden finden Sie die 6 Futtermittelarten, aus denen Sie wählen können:

• Kanal: Fügen Sie ansprechende Videos von einem bestimmten YouTube-Kanal hinzu.
• Wiedergabeliste: Zeigen Sie ansprechende Videos aus der von Ihnen gewählten YouTube-Wiedergabeliste an.
• Suche: Zeigen Sie ansprechende YouTube-Videos auf der Grundlage bestimmter Suchbegriffe oder -phrasen an.
• Live-Streams: Fügen Sie ansprechende Videos von bevorstehenden oder bestehenden YouTube-Livestreams hinzu.
• Einzelne Videos: Zeigen Sie ansprechende YouTube-Videos einzeln an.

Wählen Sie Ihren Feed-Typ und klicken Sie auf die Schaltfläche Weiter.

Ich zeige in diesem Beispiel Videos aus einer YouTube-Wiedergabeliste, aber Sie können jede beliebige Option wählen.

Schritt 3: Verbinden Sie Ihren neuen Feed mit YouTube

Nachdem du deinen YouTube-Feed-Typ ausgewählt hast, erscheint ein Popup-Fenster, in dem du nach einem API-Schlüssel gefragt wirst.

Mit diesem Schlüssel kann Ihre Website grundsätzlich mit YouTube kommunizieren und Videos abrufen.

Tipp für Anfänger: Falls du noch keinen API-Schlüssel hast, schau dir diese Anleitung an, wie man einen YouTube-API-Schlüssel erstellt.

Sobald Sie Ihren API-Schlüssel haben, fügen Sie ihn einfach in das Popup-Fenster ein und klicken Sie auf Hinzufügen.

Sobald Sie Ihren API-Schlüssel hinzugefügt haben, können Sie eine Quelle für die Videos eingeben.

Je nach Feed-Typ, den Sie zuvor ausgewählt haben, kann dies ein YouTube-Kanal, eine Wiedergabeliste, ein Suchbegriff und mehr sein.

Da ich mich vorhin für eine Wiedergabeliste entschieden habe, verlinke ich eine beliebige YouTube-Wiedergabeliste als Beispiel.

Öffnen Sie die Wiedergabeliste in Ihrem Webbrowser und kopieren Sie die ID am Ende der URL, wie in diesem Screenshot:

Kehren Sie dann zu Ihrer Website zurück und fügen Sie diese ID in das Popup-Fenster ein.

Klicken Sie schließlich auf Weiter, um das Hinzufügen der Quelle für Ihre YouTube-Videos abzuschließen.

Schritt 4: Anpassen des Feeds für Responsive YouTube-Videos

Danach holt das Plugin die Videos und stellt einen YouTube-Feed zusammen, der zu 100 % responsive ist und zum Design Ihrer Website passt.

Darüber hinaus können Sie mit dem Plugin zwischen verschiedenen Vorlagen mit einzigartigen Designs wählen. Sie haben 8 Optionen zur Auswahl:

• Standard
• Karussell
• Karten
• Liste
• Galerie
• Aktuelles Video
• Schaukasten-Karussell
• Widget

Wählen Sie einfach die Feed-Vorlage aus, deren Design Sie bevorzugen, und klicken Sie dann auf Weiter.

Ich habe mich für die Standardvorlagen entschieden, da ich einen einfachen Feed möchte, der viele Videos auf einmal anzeigen kann.

Und wenn Sie mehr Kontrolle darüber haben möchten, wie Ihr Video-Feed aussieht, können Sie den Live-Feed-Editor verwenden.

Hier finden die meisten Anpassungen statt. Sie können Ihr Layout, Ihre Kopfzeile, Schaltflächen, Videoelemente und vieles mehr ändern.

Außerdem können Sie in einer Live-Vorschau sehen, wie Ihr YouTube-Feed auf verschiedenen Bildschirmen aussehen wird.

Wenn Sie auf die Symbole am oberen Rand klicken, können Sie sehen, wie die Videos auf einem Mobiltelefon, einem Tablet oder einem Computer aussehen.

Fangen wir also mit der Anpassung an. Da es viele Optionen gibt, werde ich meine übliche Anpassungsroutine durchgehen, damit Sie eine Vorstellung davon bekommen, wie Sie die Optionen verwenden können.

Klicken wir also auf die Option Feed-Layout auf der linken Seite.

Auf der linken Seite sehen Sie die 4 Layout-Optionen, aus denen Sie wählen können:

• Raster
• Galerie
• Liste
• Und Karussell

Möchten Sie, dass Ihre Videos in ordentlichen Reihen und Spalten angezeigt werden?

Sie können dann das Grid-Layout verwenden. So sieht dieses Layout aus:

Was aber, wenn Sie den Schwerpunkt auf ein bestimmtes Video legen wollen?

Es gibt das Galerie-Layout, das einen großen Videoplayer mit kleineren Thumbnails darunter anzeigt.

Suchen Sie etwas, das Ihren Videos mehr Platz bietet?

Sie können das Listenlayout verwenden und die Videos in einer einzigen Spalte anzeigen.

Wenn Sie nach etwas suchen, das Ihre Website interaktiver macht, können Sie sich für das Karussell-Layout entscheiden.

So kann es auf Ihrer Website aussehen:

Sobald Sie das Layout für Ihren responsiven YouTube-Feed ausgewählt haben, klicken Sie auf Speichern , um Ihre Wahl zu bestätigen.

Sie können auch das Bedienfeld auf der linken Seite verwenden, um die Anzahl der Videos, Zeilen und Spalten zu ändern.

Klicken Sie nun oben links auf die Option Anpassen.

Nachdem wir das Layout festgelegt haben, ist es nun an der Zeit, die Farben zu ändern.

Sie können dies über die Option Farbschema auf der linken Seite tun.

Der Einfachheit halber können Sie aus 4 Farbschemata wählen:

• Vom Theme erben: Mit dieser praktischen Option werden die Farben Ihres Themas für den YouTube-Video-Feed übernommen.
• Hell: Das klassische helle Farbschema mit einem klaren weißen Hintergrund und dunkler Schrift
• Dunkel: Dies ist das Gegenteil mit einem dunklen Hintergrund und einer weißen Schriftfarbe
• Benutzerdefiniert: Um die volle Kontrolle über die Farben zu haben, können Sie alle Farben manuell selbst auswählen

Wählen Sie wie üblich die gewünschte Option aus und klicken Sie auf Speichern.

Ich denke, Sie haben jetzt eine Vorstellung davon. Verwenden Sie die verbleibenden Optionen, um Ihre Kopfzeile, Videoelemente, Schaltflächen und mehr zu ändern.

Sie können sogar ein Anmeldebanner unter dem Video einblenden, so dass die Besucher das Video direkt während der Wiedergabe abonnieren können.

Wenn Sie mit dem Design Ihres Feeds zufrieden sind, klicken Sie auf Speichern und fahren Sie mit dem letzten Schritt fort.

Schritt 5: Einbetten des Responsive YouTube Video Feeds

Um Ihnen mehr Kontrolle zu geben, gibt es 2 Möglichkeiten, diesen YouTube-Feed zu Ihrer Website hinzuzufügen:

• Auf Ihrer WordPress-Seite
• Oder auf Ihren Widget-fähigen Bereichen wie Seitenleiste oder Fußzeile

Ich werde im Folgenden beide Optionen erläutern:

Responsive YouTube-Videos in WordPress-Seite einbetten

Um Zeit zu sparen, können Sie das Video direkt von hier aus zu einer Seite hinzufügen.

Verwenden Sie die Schaltfläche Einbetten oben, um loszulegen.

Daraufhin öffnet sich ein Popup mit allen Möglichkeiten, wie Sie diesen YouTube-Feed einbetten können.

Sie können einen Ort auswählen oder einfach den Shortcode kopieren, um ihn manuell an einer beliebigen Stelle Ihrer Website einzufügen.

Verwenden wir zunächst die Option " Zu einer Seite hinzufügen".

Das Popup zeigt dann eine Liste Ihrer veröffentlichten WordPress-Seiten an.

Wählen Sie die Seite aus, auf der Sie die responsiven YouTube-Videos anzeigen möchten, und klicken Sie auf Hinzufügen.

Es dauert nur ein paar Sekunden, und das Plugin öffnet die Seite im WordPress-Editor.

Fügen Sie von hier aus einen neuen Block mit dem Pluszeichen (+) hinzu.

Daraufhin wird ein Panel mit den verschiedenen WordPress-Blöcken angezeigt, die Sie zu einer Seite hinzufügen können.

Suchen Sie in der Suchleiste nach "youtube feed" und klicken Sie dann auf den Block " Feeds for YouTube".

Auf diese Weise erhalten Sie automatisch eine Vorschau darauf, wie Ihr responsiver YouTube-Video-Feed auf Ihrer Seite eingebettet aussehen wird.

Klicken Sie auf Aktualisieren, um die responsiven Videos live auf Ihrer Website anzuzeigen.

Damit können Sie Ihre Website öffnen und sehen, wie Ihre Videos aussehen. So sieht mein Beispiel aus:

Responsive YouTube-Videos in WordPress-Seitenleiste oder Fußzeile einbetten

Wenn Sie Ihre responsiven Videos lieber in Ihrer Seitenleiste oder Fußzeile einbetten möchten, können Sie auch das mit dem Plugin tun.

Zunächst müssen wir den Live-Feed-Editor erneut öffnen (nur für den Fall, dass Sie weggeblättert haben), was ziemlich einfach ist.

Navigieren Sie in Ihrem WordPress-Dashboard zu YouTube-Feed " Alle Feeds und klicken Sie dann auf den Feed, den Sie einbetten möchten.

Dadurch wird der uns bereits bekannte Live-Feed-Editor geöffnet.

Klicken Sie auf die Schaltfläche " Einbetten" am oberen Rand, um fortzufahren.

Klicken Sie dieses Mal auf die Schaltfläche Zu einem Widget hinzufügen im Popup-Fenster.

Warten Sie ein paar Sekunden und YouTube Feed Pro wird die Widgets-Seite Ihrer Website öffnen.

Auf dieser Seite können Sie ein beliebiges Footer- oder Header-Panel auswählen, um Ihre responsiven YouTube-Videos anzuzeigen.

Die genaue Anzahl der Panels hängt von Ihrem WordPress-Theme ab.

Für dieses Beispiel wähle ich die Seitenleiste aus, aber Sie können jede beliebige Position wählen.

Nachdem Sie das Panel geöffnet haben, können Sie ein neues Widget hinzufügen, indem Sie hier auf das Plus-Symbol (+) klicken.

Wählen Sie schließlich das Widget " Feeds für YouTube", um Ihre Videos einzubetten.

Sie können nun auf Aktualisieren klicken, um Ihr neues YouTube-Feed-Widget zu bestätigen.

Wenn Sie also Ihre Website besuchen, können Sie Ihre responsiven Videos in der Seitenleiste sehen:

Und schon sind Sie fertig!

Beginnen Sie jetzt mit dem Einbetten Ihrer responsiven YouTube-Videos

Meiner Erfahrung nach ist es eines der wichtigsten Dinge, die Sie für Ihre Website tun können, sicherzustellen, dass Ihre YouTube-Videos responsive sind.

Schließlich schaut niemand gerne Videos, die sich nicht an die Bildschirmgröße anpassen, oder?

Dieser Leitfaden hat gezeigt, dass Sie sich nicht mit Code abmühen müssen, um dies zu erreichen.

Die Verwendung von Smash Balloon YouTube Feed Pro ist der direkteste und zuverlässigste Weg, um sicherzustellen, dass Ihre Videos auf jedem Gerät und zu jeder Zeit perfekt aussehen.

Hier erfahren Sie, wie Sie loslegen können:

• Holen Sie sich Ihr Exemplar von YouTube Feed Pro und testen Sie es 14 Tage lang risikofrei, um YouTube-Videos auf Ihrer WordPress-Website einzubetten
• Mit dem Live-Feed-Editor können Sie Ihren responsiven Video-Feed ganz einfach anpassen, damit er perfekt zum Stil Ihrer Marke passt.
• Binden Sie Ihren neuen mobilfreundlichen YouTube-Video-Feed nahtlos in jede Seite, jeden Beitrag oder jeden Widget-Bereich in der Seitenleiste ein.

Haben Sie Fragen zum Einbetten von responsiven YouTube-Videos oder zu den ersten Schritten mit YouTube Feed Pro? Bitte fragen Sie mich in den Kommentaren unten.

Haben Sie eine Elementor-Website? Hier erfahren Sie, wie Sie Ihren YouTube-Kanal in Elementor einbetten können.

Weitere YouTube Marketing Anleitungen und Tutorials

• Wie Sie Ihre YouTube-Videos kostenlos bewerben können (Expertentipps)
• Beste YouTube-Plugins, um Ihre Abonnenten jetzt zu erhöhen
• Wie man auf YouTube Geld verdient, ohne sein Gesicht zu zeigen
• Gründe, warum deine YouTube-Kurzfilme nicht angesehen werden [+ was zu tun ist]
• YouTube Shorts vs. TikTok: Was ist das Beste für Sie?