Wie man YouTube Shorts in Ihre Website einbettet

Wusstest du schon? YouTube Shorts übertraf im Jahr 2025 täglich 200 Milliarden Aufrufe, gesehen von mehr als 2 Milliarden registrierten Nutzern jeden Monat. – YouTube-CEO Neal Mohan.

YouTube Shorts erzielen beachtliche Reichweiten auf der Plattform. Wenn Sie sie bereits erstellen – Produkt-Demos, Tutorials, Behind-the-Scenes-Clips – können Sie denselben Content auch auf Ihrer Website nutzen. Eine 30-Sekunden-Demo auf der Produktseite, ein Kundenreaktions-Short in Testimonials, ein Tutorial-Short in einem Blogbeitrag – all dies kann dort platziert werden, wo es für die Entscheidung des Besuchers relevant ist.

Das YouTube-Galerie-Widget ist eine Möglichkeit, dies zu erreichen: Es zeigt einen Shorts-Feed, der sich automatisch aktualisiert, sobald Sie Shorts veröffentlichen, und verfügt über integrierte Layout- und Designsteuerungen. Sie können auch einzelne Shorts manuell per iframe einbetten oder eine benutzerdefinierte Integration von Grund auf neu mit der YouTube Data API erstellen. Unten finden Sie eine Übersicht über alle drei Methoden, damit Sie die passende Lösung für Ihr Setup auswählen können.

Shorts in 4 Schritten auf Ihrer Website einbetten

So geht’s am schnellsten zu einer funktionsfähigen Shorts-Galerie auf deiner Website:

1. Öffnen Sie den YouTube-Galerie-Editor und wählen Sie eine Vorlage.
2. Fügen Sie Ihren Shorts-Playlist-Link als Inhaltsquelle hinzu.
3. Klicken Sie auf „Zur Website hinzufügen“, um den Einbettungscode zu erhalten.
4. Fügen Sie den Code in einen benutzerdefinierten HTML-Block ein und veröffentlichen Sie ihn.

Erstelle unten im interaktiven Editor dein YouTube Shorts-Widget ↓

Die besten Wege, YouTube Shorts einzubetten

Nicht jede Methode funktioniert gleich. Die richtige Wahl hängt davon ab, ob Sie ein einzelnes Short oder einen gesamten Feed einbetten müssen und wie viel Kontrolle Sie über das Design wünschen.

Das Elfsight-Widget ist der einfachste Weg, eine automatisch aktualisierende YouTube-Shorts-Galerie ohne Programmierung zu erstellen. iFrame-Einbettungen sind kostenlos und einfach für einzelne Shorts, erfordern aber manuelle Updates bei jedem neuen Video. Die YouTube Data API bietet volle Flexibilität – bedeutet aber auch, die gesamte Integration eigenständig zu warten — inklusive Datenabfrage, Rendering, Paginierung und Caching.

Einzelne Shorts vs. vollständiger Feed

Die passende Einbettung hängt davon ab, was Ihr Unternehmen mit Shorts macht und wo auf der Website sie die größte Wirkung entfalten würden.

Einige Unternehmen profitieren von beidem: einzelne Shorts, bei denen ein bestimmtes Video eine bestimmte Seite unterstützt, sowie eine Galerie-Sektion, in der Besucher mehrere Shorts gleichzeitig durchsuchen können.

Schritt-für-Schritt: Einrichtung Ihres YouTube Shorts-Widgets

Lassen Sie uns die Elfsight YouTube Gallery-Methode durchgehen – der flexibelste Weg, einen automatisch aktualisierenden Shorts-Feed mit Layout-Steuerung einzubetten.

Schritt 1: Editor öffnen und eine Startvorlage auswählen.

Gehe zum Editor und stöbere durch die verfügbaren Presets. Jede Vorlage kommt mit einem vorkonfigurierten Layout, Farbschema und Raster-Setup — wähle die dem Ziel am nächsten liegende Vorlage und passe sie anschließend an.

Schritt 2: Füge deine Shorts-Quelle hinzu

Dieser Schritt bestimmt, ob Ihr Widget Shorts, reguläre Videos oder beides anzeigt. Im Quelle -Tab legen Sie fest, von wo das Widget Inhalte zieht.

Option A – Shorts-Playlist

Wenn Sie bereits eine YouTube-Playlist haben, die alle Shorts bzw. bestimmte Shorts enthält, fügen Sie die Playlist-URL direkt in das Feld Quelle ein. Das Widget zeigt diese Shorts in der gleichen Reihenfolge an, wie sie in Ihrer YouTube-Playlist erscheinen.

Option B — Kanal-ID-Anpassung

Dieses Tool holt automatisch alle Shorts aus Ihrem Kanal – ohne dass Sie eine Wiedergabeliste pflegen müssen.

1. Gehen Sie zu Ihrem YouTube-Kanal und klicken Sie auf die Teilen-Schaltfläche, um Ihre Kanal-ID zu finden (sie beginnt mit UC).
2. Ersetzen Sie am Anfang Ihrer ID UC durch UUSH.
3. Erstelle eine Playlist-URL: https://www.youtube.com/playlist?list=UUSH9LQwHZoucFT94I2h6JOcjw
4. Im Widget-Editor gehen Sie zu Quellgruppen und fügen Sie diese URL als Playlist-Quelle ein.

Zum Beispiel sieht Ihre Kanal-ID so aus: UCqhnX4jA0A5paNd1v-zEysw, wird die Shorts-only-ID zu UUSHqhnX4jA0A5paNd1v-zEysw.

Option C – Individuelle Kurz-URLs

Wenn Sie nur ausgewählte Shorts wünschen — nicht Ihren gesamten Kanal — fügen Sie sie nacheinander als einzelne Videoquellen in Source Groups hinzu. Fügen Sie jede vollständige YouTube-URL eines Shorts als separate Quelle ein. So behalten Sie die vollständige Kontrolle darüber, welche Shorts genau erscheinen.

Schritt 3: Quellgruppen konfigurieren

Quellgruppen geben Ihnen eine granulare Kontrolle darüber, was im Widget erscheint und wie es organisiert ist. Falls Sie Ihre Shorts-Playlist oder Ihren UUSH-Link hinzugefügt haben, wird er hier aufgelistet. Jede Quellgruppe erhält ihren eigenen Reiter im Widget, sodass Besucher zwischen Gruppen wechseln können, wenn Sie mehr als eine haben.

Einige Dinge, die Sie hier einrichten sollten:

• Gruppenname — Vergeben Sie der Gruppe eine klare Bezeichnung (z. B. „Produkt-Demos“, „Hinter den Kulissen“, „Tutorials“). Diese erscheint als Registerkarte im Widget.
• Mehrere Gruppen — Sie können separate Gruppen für verschiedene Shorts-Playlists erstellen oder Shorts mit regulären Videos in verschiedenen Tabs mischen. Kanäle, Playlists und einzelne Videos können alle in einem Widget vereint werden.
• Nur eine Gruppe? — Wenn Sie nur eine Quellgruppe haben, verstecken Sie die Tabs der Gruppe in den Layout-Einstellungen, um die Oberfläche übersichtlich zu halten.

Beachten Sie, dass Inhalte aus Quellgruppen die Hauptkanal-URL überschreiben. Wenn Sie im Primärquellenfeld einen Kanal festlegen und anschließend Quellgruppen hinzufügen, werden nur Inhalte aus den Quellgruppen angezeigt.

Schritt 4: Wählen Sie Ihr Layout

Der Layout Tab steuert, wie Ihre Shorts auf der Seite erscheinen:

• Header – Kanalbanner, Logo, Name und Zähler, die über Ihren Videos angezeigt werden.
• Spalten & Zeilen — das Raster-Layout: wie viele Videos gleichzeitig angezeigt werden, Abstände und Breite.
• Video — wie jedes Vorschaubild aussieht (Classic/Horizontal/Cinema) und was passiert, wenn darauf geklickt wird.
• Popup — Was im Video-Player angezeigt wird, der beim Klicken geöffnet wird (Titel, Statistiken, Beschreibung, Kommentare).
• Slider-Einstellungen — wie Besucher durch Videos navigieren: Pfeile, Ziehen, Paginierung und Autoplay.

Classic

Ein Standardgitter aus Video-Thumbnails. Ideal für einen eigenständigen Shorts-Bereich oder Content-Hub. Sie legen die Anzahl der Spalten und Zeilen fest, sodass ein 3×2-Gitter sechs Shorts auf einmal zeigt.

Kino

Ein großer Highlight-Videoplayer mit einer Thumbnails-Leiste darunter. Ideal, um einen Short zu präsentieren, während Besucher weitere durchsuchen. Am besten funktioniert es, wenn Sie einen klaren „Hero“-Short zum Lead setzen.

Horizontal

Eine horizontal scrollende Thumbnail-Leiste. Ideal, um Shorts als Inhaltsband zwischen anderen Seitenabschnitten einzubetten – ähnlich wie YouTube Shorts in einer horizontalen Reihe angezeigt werden.

Für eine Shorts-spezifische Galerie funktioniert Classic mit 3–4 Spalten am besten auf dem Desktop – jedes Thumbnail hat so genug Platz, damit es gut erkennbar bleibt. Auf schmaleren Bildschirmen passt sich die Widget-Anzeige automatisch der Spaltenzahl an. Unter den Rastereinstellungen können Sie außerdem separate Spaltenkonfigurationen festlegen für Desktop und Mobil.

Schritt 5: Wiedergabe- und Popup-Optionen festlegen

Als Nächstes entscheiden Sie, was passiert, wenn ein Besucher auf einen Short klickt. Drei Spielmodi stehen zur Auswahl:

• Popup-Player — Öffnet das Short in einem Lightbox-Overlay auf derselben Seite. Das Popup verfügt über 12 ein- bzw. ausblendbare Elemente (Titel, Beschreibung, Likes, Aufrufe, Kommentare, Teilen-Schaltflächen und mehr) — zeigen oder verstecken Sie jedes Element einzeln, um die Bedienoberfläche sauber zu halten.
• Neues YouTube-Fenster — Öffnet YouTube Shorts in einem neuen Tab. Nützlich, wenn du Traffic zu deinem YouTube-Kanal lenken möchtest, doch es führt Besucher von deiner Website weg.
• Inline-Vorschau — Spielt das Kurzvideo direkt in der Miniaturansicht ab, ohne Overlay. Kompakt und unaufdringlich.

Für die meisten Shorts-Anwendungsfälle bietet der Popup-Player den besten Kompromiss – er hält Besucher auf deiner Website fest und sorgt dafür, dass das Video ausreichend Bildschirmplatz hat, um ansprechend zu bleiben. Wenn du Shorts als Social Proof (Kundenreaktionen, Testimonials) einsetzt, erlaubt der Popup außerdem, die Like-Zahl und Kommentare als Vertrauenssignale anzuzeigen.

Schritt 6: Design anpassen

Die Gestaltungseinstellungen ermöglichen es Ihnen, das Widget an das visuelle Erscheinungsbild Ihrer Website anzupassen. Sie müssen nicht alle Optionen verwenden – hier sind die verfügbaren Optionen:

• Farbschema — das komplette Farbschema-Set (Standard, Dunkel, Rot, Tiefblau oder Benutzerdefiniert), das das gesamte Widget auf einmal einfärbt.
• Menu – Farben der Gruppen-/Registerkartenleiste: Link-, Hover- und Aktiv-Tab-Zustände.
• Video — Farben von Miniaturansichten und deren Elementen: Hintergrund, Overlay, Wiedergabe-Symbol, Titel, Datum, Zähler.
• Popup — Farben für den Klick-zu-Öffnen-Player: Overlay, Titel, Kanal-Infos, Zähler, Links.
• Schieberegler – Farben der Navigation: Hintergrund des Inhalts und die Pfeile (Standard- und Hover-Zustände).

Schritt 7: Navigation und Anzeigeeinstellungen anpassen

Die Erweiterte Registerkarte bietet einige Einstellungen, die man leicht überspringt, aber es lohnt sich, sie zu kennen — insbesondere, wenn Sie eine stark frequentierte Website betreiben oder Wert auf den Datenschutz Ihrer Besucher legen.

Datenschutz-Verbesserungsmodus — Lädt Videos über youtube-nocookie.com statt der Standard-YouTube-Domäne, wodurch Tracking-Cookies erst gesetzt werden, bis ein Besucher tatsächlich ein Video abspielt. Es deaktiviert außerdem die Abonnieren-Schaltfläche im Header und im Pop-up. Es lohnt sich, dies aktiviert zu lassen, wenn Ihre Website den GDPR- oder ähnliche Datenschutzvorgaben entsprechen muss.

Sprache — Stellen Sie die Sprache der Widget-Oberfläche aus einem Dropdown mit über 18 Optionen ein. Stimmen Sie sie auf die Hauptsprache Ihrer Website ab, damit Beschriftungen der Buttons und Texte der Benutzeroberfläche wie Muttersprachler wirken.

YouTube-API-Schlüssel — Das Widget verwendet standardmäßig einen gemeinsamen Elfsight API-Schlüssel, der für die meisten Websites gut funktioniert. Falls Ihre Website stark frequentiert ist und die Galerie nicht mehr aktualisiert wird, können Sie hier Ihren eigenen YouTube-API-Schlüssel eingeben, um gemeinsame Quotenlimits zu vermeiden.

AdSense — Wenn Sie Google AdSense betreiben, können Sie es direkt in die Galerie integrieren, indem Sie Ihre AdSense-Kundennummer und Slot-Identifikatoren eingeben. Anzeigen können im Inhaltsbereich (Video-Gitter) und im Popup-Player erscheinen.

Schritt 8: Das Widget in Ihre Website einbetten

Sobald Sie mit der Einrichtung zufrieden sind, klicken Sie im Editor auf „In die Website hinzufügen“, um Ihren Embed-Code zu erhalten. Es handelt sich um ein kurzes HTML-Snippet — ein Script-Tag plus ein Div — das Sie in das Backend Ihrer Website einfügen.

WordPress, Shopify, Squarespace, Wix, Webflow, and plain HTML websites. Setup steps may vary slightly per platform — follow the links for CMS-specific guides.”>Der YouTube Shorts-Einbettungscode funktioniert auf jeder Plattform, die benutzerdefiniertes HTML unterstützt, darunter WordPress, Shopify, Squarespace, Wix, Webflow und einfache HTML-Websites. Die Einrichtungs-Schritte können je nach Plattform leicht variieren — folgen Sie den Links zu CMS-spezifischen Anleitungen.

Schneller Fehlerbehebungs-Check

• Shorts erscheinen nicht: Wenn Sie Source Groups verwenden, stellen Sie sicher, dass das Feld für die Hauptkanal-URL leer ist — Source Groups überschreiben es, und ein Konflikt kann das Laden von Inhalten verhindern.
• Nur reguläre Videos anzeigen (keine Shorts): Vergewissern Sie sich, dass Sie das UUSH-Kanal-ID-Präfix oder eine Shorts-spezifische Wiedergabelisten-URL verwenden, nicht Ihre reguläre Kanal-URL.
• Widget lädt überhaupt nicht: Überprüfen Sie, dass der Einbettungscode in einen benutzerdefinierten HTML-Block (nicht in einen Absatz- oder Textblock) eingefügt ist. Einige Caching-Plugins können auch den ersten Render verzögern — leeren Sie nach der Installation den Website-Cache.
• Videos werden nicht aktualisiert: Das Widget speichert Inhalte im Cache und aktualisiert sich alle 24 Stunden. Neue Shorts erscheinen nicht sofort. Falls Inhalte nach 24 Stunden noch veraltet sind, prüfen Sie den Fehlerbehebungsleitfaden für API-Quotenprobleme.

Weitere Methoden, YouTube Shorts in deine Website einzubetten

Wenn Sie nur ein einzelnes Short einbetten müssen — oder einen Ansatz ohne Abhängigkeiten bevorzugen — funktionieren diese Methoden ohne Drittanbieter-Tools.

Option 1: YouTube-IFrame-Einbettungscode (jede Website)

YouTube bietet keine dedizierte Einbettungsoption für Shorts wie bei regulären Videos. Sie können jedoch manuell ein iframe erstellen, indem Sie die URL des Shorts anpassen. Diese Methode funktioniert auf jeder Website, die HTML unterstützt.

1. Öffnen Sie den YouTube Short, den Sie einbetten möchten, und kopieren Sie dessen URL. Diese sieht dann so aus: https://www.youtube.com/shorts/VIDEO_ID
2. Ersetze /shorts/ durch /embed/ in der URL. Das Ergebnis: https://www.youtube.com/embed/VIDEO_ID
3. Wickeln Sie die URL in ein iFrame-Tag ein. Für einen vertikalen Short (9:16) verwenden Sie width=”315″ und height=”560″: <iframe width=”315″ height=”560″ src=”https://www.youtube.com/embed/VIDEO_ID” title=”YouTube Short” frameborder=”0″ allow=”accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope” allowfullscreen></iframe>
4. Füge diesen iframe-Code in einen benutzerdefinierten HTML-Block auf deiner Website ein und veröffentliche ihn.

Sie können URL-Parameter wie &autoplay=1 (automatisches Starten, stumm in den meisten Browsern), &loop=1 (Wiederholung) oder &controls=0 (Verstecken der Player-Schaltflächen) hinzufügen, um ein saubereres Erscheinungsbild zu erzielen. Indem Sie loading=”lazy” dem iframe-Tag hinzufügen, verzögert sich das Laden, bis das Video in den Sichtbereich scrollt – dies verbessert die Seitenladegeschwindigkeit.

WordPress-Verknüpfung

Wenn du YouTube Shorts in WordPress einbetten musst, ersetze in der URL /shorts/ durch /watch?v= und füge es direkt in den Block-Editor ein — WordPress bettet es automatisch via oEmbed ein. Der Nachteil: Es wird in einem 16:9-Landschaftsplayer gerendert (nicht vertikal) und dir fehlt jegliche Designkontrolle.

Option 2: YouTube Data API (individuelle Integration)

Für Teams mit Ressourcen in der Entwicklung, die vollständige Kontrolle darüber benötigen, wie Shorts abgerufen, gefiltert und angezeigt werden, ermöglicht die YouTube Data API v3 Ihnen, eine maßgeschneiderte Integration von Grund auf neu zu erstellen. Dies ist die flexibelste Option – aber auch die aufwändigste.

1. Google Cloud Console and enable the YouTube Data API v3.”>In der Google Cloud Console ein Projekt erstellen und die YouTube Data API v3 aktivieren.
2. Generieren Sie einen API-Schlüssel (oder richten Sie OAuth ein, falls Sie Zugriff auf private Daten benötigen).
3. Verwenden Sie den Endpunkt playlistItems.list, um Videos aus der Upload-Playlist eines Kanals abzurufen – oder aus einer Shorts-spezifischen Wiedergabeliste mit dem zuvor beschriebenen UUSH-Kanal-ID-Präfix.
4. Erstellen Sie einen Frontend-Player und ein Layout, um die abgerufenen Shorts auf Ihrer Website darzustellen.
5. Caching, Paginierung und API-Quotenverwaltung selbst verwalten.

Profi-Tipps für Ihr YouTube Shorts-Widget

Ihre Shorts sind eingebettet – jetzt lassen wir sie besser arbeiten. Diese Tipps gelten, egal ob Sie eine Widget-Galerie oder einzelne iFrame-Einbettungen verwenden.

1. Kurzvideos dort platzieren, wo die Absicht am höchsten ist. Eine Kurzvideo-Galerie auf Ihrer Startseite zieht Aufmerksamkeit auf sich, aber Platzierungen auf der Produktseite beeinflussen Entscheidungen. Platzieren Sie Demo-Kurzvideos direkt auf der relevanten Produktseite, nicht versteckt in einem generischen Videobereich, der drei Klicks entfernt ist.
2. Quellgruppen fokussieren. Wenn deine Kurzvideos verschiedene Themen abdecken (Tutorials, Kundenreaktionen, Produkteinführungen), gliedere sie in separate Quellgruppen mit klaren Tabs. Besucher finden schneller, was sie suchen, und du vermeidest einen chaotischen Alles-auf-einen Blick-Feed.
3. Header bei Inline-Platzierungen ausblenden. Wenn Sie ein Shorts-Widget in einen Abschnitt einbetten, der bereits eine Überschrift und Kontext hat, wird der Kanal-Header des Widgets redundant. Deaktivieren Sie ihn für eine saubere Integration — die Shorts sprechen für sich.
4. Verwenden Sie ein 1-Spalten-Gitter für eine vertikale Scroll-Erfahrung. Wenn Sie ein TikTok-ähnliches Browsing-Gefühl wünschen — jeweils ein Short, während Sie nach unten scrollen — konfigurieren Sie das Raster mit 1 Spalte. Kombinieren Sie es mit dem Cinema-Layout für einen großen Featured-Player mit einer Thumbnail-Leiste daneben.

Häufig gestellte Fragen

Fazit

Sie haben jetzt drei praktikable Möglichkeiten, YouTube Shorts auf Ihrer Website einzubetten — von einem kurzen iFrame für ein einzelnes Video bis hin zu einer vollständig anpassbaren, automatisch aktualisierenden Galerie über das Elfsight-Widget. Welche Lösung passt, hängt davon ab, ob Sie eine einmalige Einbettung oder einen fortlaufenden Content-Feed benötigen und wie viel Designkontrolle für Ihr Layout wichtig ist.

Wenn du regelmäßig Shorts veröffentlichst und möchtest, dass sie automatisch auf deiner Website erscheinen, probiere den YouTube Gallery-Editor — lege deine Quelle fest, wähle ein Layout, und das Widget kümmert den Rest. Für einen einheitlichen Überblick über deine Social-Media-Inhalte über verschiedene Plattformen hinweg, schau dir stattdessen das Social Feed Widget an.

Artikel von

Valeriya Polyakova

Content-Manager

Als Content-Manager bei Elfsight erstelle ich Inhalte, die sowohl praktisch als auch inspirierend sind. Ich liebe es, Komplexes einfach und angenehm lesbar zu gestalten.

Auf Facebook folgen

Folgen Sie uns auf X

Auf LinkedIn folgen

Folge uns auf Reddit