Ein Instagram-Story-Widget bringt Ihre Live-Instagram-Stories auf Ihre Website. Diese Vorlage zeigt sie als kleinen schwebenden Avatar mit dem Label Watch Stories, und Besucher öffnen Ihre Stories und Beiträge mit einem Klick in einem Popover.
Was das Instagram-Story-Widget zeigt und wo Sie es platzieren
Ein Instagram-Story-Widget ist ein eingebettetes Element, das Ihre aktuellen Instagram Stories über die offizielle Instagram-API in eine Webseite holt. Es aktualisiert sich von selbst, solange Stories live sind, sodass Ihre Website zeigt, was Sie posten.
Ein Instagram-Stories-Popup fügt den vertrauten Avatar-Ring als kompaktes Overlay hinzu. Es bringt Social Content auf die Seite, ohne sie zu dominieren, und passt daher dort, wo ein vollständiger Feed zu schwer wirken würde.
Nutzen Sie es für Produkt-Drops, Clips hinter den Kulissen, Events oder Tagesangebote. Es passt zu E-Commerce-Produktseiten, Startseiten, Kampagnen-Landingpages und Creator- oder Lifestyle-Websites.
Um Stories zu verbinden, muss Ihr Instagram-Konto ein Business- oder Creator-Konto sein. Unser Leitfaden zum Einbetten von Instagram Stories behandelt alle Voraussetzungen, und die Seite zum Instagram-Stories-Widget zeigt Layouts und Tarife.
- Startseite: ein Social-Berührungspunkt, der Ihren Hauptinhalt nicht nach unten schiebt.
- Preisseite: kurze Clips von Kunden oder dem Team schaffen Vertrauen, ohne die Tarife zu überfrachten.
- Produktseiten: Stories, die das Produkt im Einsatz zeigen, sind nur einen Klick vom Kaufen-Button entfernt.
- Landingpages: Kampagnen-Stories halten eine Launch-Seite so lange aktuell, wie sie läuft.
So fügen Sie Ihrer Website ein Instagram-Story-Widget hinzu
- Verbinden Sie Ihre Instagram-Stories-Quelle in EmbedSocial.
- Wählen Sie die Vorlage Instagram Stories Popover.
- Passen Sie Avatar-Stil, Popover-Text und Widget-Position an.
- Legen Sie fest, wann und wo das Widget auf der Seite erscheinen soll.
- Kopieren Sie den Einbettungscode.
- Fügen Sie ihn in Ihre Website, Landingpage oder Ihr CMS ein und veröffentlichen Sie.
WordPress
Öffnen Sie die Seite im Block-Editor und fügen Sie einen Custom-HTML-Block hinzu. Fügen Sie den Einbettungscode ein und aktualisieren Sie die Seite. Das Popup schwebt über dem Inhalt, wo auch immer der Block sitzt.
Shopify
Gehen Sie zu Online Store > Themes > Customize und fügen Sie der gewünschten Vorlage einen Custom-Liquid-Abschnitt hinzu. Fügen Sie den Einbettungscode ein und speichern Sie.
Wix
Fügen Sie ein Element Embed a Site oder HTML iFrame hinzu (der Name hängt von Ihrer Editor-Version ab). Fügen Sie den Code ein und veröffentlichen Sie.
Squarespace
Bearbeiten Sie die Seite und fügen Sie einen Embed Block hinzu. Fügen Sie den Code in das zugehörige Codefeld ein und speichern Sie.
Popup im Vergleich zu anderen Layouts
| Layout | Am besten für | Zeigt | Vorlage |
|---|---|---|---|
| Popup | Stories ohne neuen Bereich hinzufügen | Schwebender Avatar und ein Popover mit Stories und Beiträgen | Instagram-Stories-Widget: Popup |
| Autoplay-Slider | Ein eigener Stories-Bereich | Eine Reihe hoher Story-Karten, die sich von selbst weiterbewegen | Instagram Stories Autoplay-Slider |
| Stories-und-Beiträge-Slider | Stories mit Ihrem Feed mischen | Ein horizontaler Slider mit Stories und aktuellen Beiträgen | Klassisches Instagram-Stories-und-Beiträge-Slider-Widget |






