Mit Instagram kannst du Fotos und kurze Videos mit deinem Smartphone aufnehmen, anpassen und teilen. Dieser Ratgeber zeigt dir, wie du Instagram-Beiträge auf deiner Website einbetten kannst.
In diesem Ratgeber
Video-Transkript
Hallo, in diesem Video zeigen wir dir, wie du Instagram-Beiträge mit dem WordPress-Editor einbetten kannst.
Zunächst einmal fügen wir unseren Instagram-Block hinzu.
Anschließend können wir den Link aus einem bestehenden Beitrag kopieren. Hier habe ich einen.
Ich kann ihn direkt in den Button einfügen. Und wenn ich auf „Einbetten“ klicke, kann ich die Beiträge auf der Seite oder in dem Beitrag sehen, auf der bzw. in dem ich den Link hinzufüge.
Und das funktioniert auch bei Videos problemlos.
Wenn du einen Instagram-Beitrag einbettest, können deine Website-Besucher das Foto oder Video direkt auf deiner Website ansehen, ohne die Instagram-Website besuchen zu müssen. Du kannst Fotos, Videos und Reels einbetten. Befolge diese Schritte, um einen Beitrag aus Instagram einzubetten:
- Kopiere die URL des Instagram-Beitrags aus der Adressleiste deines Webbrowsers oder der Instagram-App. Das sieht dann etwa so aus:
https://www.instagram.com/p/CuzSGmjO5MP - Füge die URL im WordPress-Editor in einer neuen Zeile ein, ohne anderen Text oder Leerzeichen hinzuzufügen. Dadurch wird der Beitrag automatisch in einem Einbetten-Block eingebettet. Standardmäßig bettet die URL die größte verfügbare Größe des Bilds ein, sprich eine Breite von 612 Pixel.
- (Optional) In der Toolbar, die über oder unter der Einbettung erscheint, kannst du die Einbettung links, rechts oder mittig ausrichten.
- (Optional) Aktiviere in den Blockeinstellungen die Option Für kleinere Geräte skalieren, um das Seitenverhältnis bei unterschiedlichen Browsergrößen beizubehalten.
Video-Einbettungen sehen sehr ähnlich aus, enthalten aber das dreieckige „Wiedergabe“-Icon:
Wenn deine Einbettung nicht funktioniert, findest du in unserem Ratgeber zur Problembehandlung bei eingebetteten Links die Gründe dafür.
Verwende den Block Neueste Instagram-Beiträge, um ein Raster der neuesten Beiträge aus deinem Instagram-Profil anzuzeigen, das sich automatisch aktualisiert.
Klicke zum Hinzufügen des Blocks Neueste Instagram-Beiträge auf das Icon + Block–Inserter und suche nach „Instagram“. Klicke auf Neueste Instagram-Beiträge, um den Block zu dem Beitrag oder der Seite hinzuzufügen.
Eine detaillierte Anleitung zum Hinzufügen von Blöcken findest du hier.
Wenn du den Block „Neueste Instagram-Beiträge“ hinzugefügt hast, wirst du aufgefordert, dein Instagram-Konto zu verbinden. Bei einer Website mit Plugins müssen die Privatsphäre-Einstellungen auf „Öffentlich“ oder „Demnächst verfügbar“ festgelegt sein, nicht auf „Privat“.
Gehe folgendermaßen vor, um deine Website mit Instagram zu verbinden:
- Klicke auf Verbinde dich mit Instagram.
- Genehmige die Verbindung im Pop-up-Fenster, indem du auf Zulassen klickst.
- Wähle das Konto aus, mit dem du dich verbinden möchtest, wie in der Abbildung unten gezeigt.
- Klicke noch einmal auf Verbinde dich mit Instagram.
Dir wird ein Raster deiner neun letzten Instagram-Beiträge angezeigt, die auf der Seite eingebettet sind. Collaborative Collections (Gemeinsame Sammlungen) (in einer Unterhaltung geteilte Beiträge) sind aktuell nicht enthalten. Rufe den nächsten Schritt auf, um zu erfahren, wie du das Raster anpassen kannst.
In deinem Dashboard kannst du deine Website mit Instagram verbinden und die Verbindung trennen. Navigiere dazu zu Tools → Marketing → Verbindungen (oder Hosting → Verbindungen bei Verwendung von WP Admin). Wenn du Instagram hier trennst, wird die Verbindung auf allen Websites in deinem WordPress.com-Konto entfernt.
Wenn du einen Block auswählst, siehst du in der rechten Seitenleiste weitere Blockeinstellungen. Wenn die Seitenleiste nicht angezeigt wird, musst du ggf. oben rechts in der Ecke auf das Icon Einstellungen klicken, um die Einstellungen zu öffnen. Dieses Icon sieht wie ein Quadrat mit zwei ungleichen Spalten aus:
Dies sind die Optionen:
Kontoeinstellungen: Zeige das Instagram-Konto an, das du verbunden hast. Trenne dieses Konto, wenn du es entfernen oder ein anderes Konto verbinden möchtest.
Anzeigeeinstellungen Passe die Anzahl der angezeigten Instagram-Beiträge, die Anzahl der verwendeten Spalten und den Abstand (berechnet in Pixeln) zwischen den einzelnen Beiträgen im Instagram-Raster an.:
Auf Mobilgeräten stapeln: Wenn du die Option „Auf Mobilgeräten stapeln“ auswählst, werden die Inhalte auf der linken Seite über dem Inhalt auf der rechten Seite angezeigt (anstatt nebeneinander wie auf Desktop-Bildschirmen). Auf diese Weise werden die Inhalte besser auf Mobilgeräten dargestellt.
Erweitert: Auf dem Tab „Erweitert“ kannst du eine CSS-Klasse zu deinem Block hinzufügen, sodass du individuelles CSS erstellen und den Block gestalten kannst. Weitere Informationen zum Hinzufügen von CSS-Klassen zu Blöcken.
Ausrichtung und Breite: Die Toolbar des Blocks „Neueste Instagram-Beiträge“ enthält Optionen, um den Block rechtsbündig, zentriert oder linksbündig auszurichten. Außerdem kann die Anzeige in weiter oder voller Breite erfolgen, wenn dies von deinem Theme unterstützt wird.
Du kannst bis zu zwei Instagram-Konten verbinden, die zwei Neueste Instagram-Beiträge-Blöcke verwenden (d. h. ein Konto für jeden Block). Dazu sind zwei separate Instagram-Anmeldungen erforderlich. Dies funktioniert nicht, wenn du mehrere Instagram-Konten mit der gleichen Anmeldung verwaltest.
Nachdem du dein erstes Instagram-Konto mit deiner Website verbunden hast, befolge diese Schritte, um ein zweites Konto zu verbinden:
- Rufe auf einem neuen Browser-Tab Instagram.com auf und melde dich bei dem ersten Instagram-Konto ab.
- Melde dich bei dem zweiten Instagram-Konto an.
- Rufe das Dashboard deiner Website auf.
- Navigiere zu Tools → Marketing → Verbindungen (oder Hosting → Verbindungen bei Verwendung von WP Admin).
- Klicke unter „Instagram“ auf den Dropdown-Pfeil und wähle Ein weiteres Konto verbinden aus.
- Sobald dieses verbunden wurde, kannst du zwei Neueste Instagram-Beiträge-Blöcke verwenden.
Es gibt noch andere Möglichkeiten, Instagram in deine Website zu integrieren. Dazu zählen folgende:
- Zeige mit einem Social-Icons-Block ein Instagram-Logo an, das einen Link zu deinem Profil enthält.
- Teile Beiträge automatisch mit einem Instagram Business-Konto.
Support 