Der Artikel erläutert, wie man einen Instagram-Feed ohne Codierung zu WordPress hinzufügt. Wir zeigen Ihnen verschiedene Möglichkeiten, Ihren eigenen Feed einzubetten, Funktionen und Einstellungen, auf die Sie mit einem benutzerfreundlichen Instagram-Feed-Widget zugreifen.
Instagram-Feed ist ein praktisches und gut gestaltetes kostenloses Premium-Plugin für WordPress, das Ihnen ermöglicht, einen interaktiven Feed mit Inhalten aus diesem Online-Medium in Ihre WordPress-Website zu integrieren. Sie können jetzt sofort mit der Erstellung Ihres Instagram-Plugins beginnen, indem Sie unsere aktive Demo verwenden. Befolgen Sie einfach die untenstehenden Schritte, dann sehen Sie Ihren Instagram-Feed:
Nutze unsere interaktive Demo und erstelle dein erstes Instagram-Plugin.
Speichern Sie Ihren Instagram-Feed und kopieren Sie den Code aus dem Pop-up-Fenster.
Fügen Sie den Code in den HTML-Editor Ihrer WordPress-Website ein.
Erstellen Sie jetzt Ihren Live-Instagram-Feed – mit unserer Demo!
Lassen Sie uns Schritt für Schritt erkunden, wie Sie ein Instagram-Feed-Plugin für Ihre WordPress-Website erstellen. Dieser Leitfaden führt Sie durch die Funktionen und Einstellungen des Plugins und hilft Ihnen, einen perfekten Instagram-Feed zu erstellen. Visuelle Hilfsmittel unterstützen Sie dabei, jeden Schritt auf Ihrer WordPress-Website nachzubilden.
Inhalte auswählen. Beginnen Sie damit, den Abschnitt „Quellen“ im linken Panel der Plugin-Einstellungen zu finden. Hier können Sie ganz einfach Ihr öffentliches oder geschäftliches Instagram-Konto mit nur einem Klick verbinden. Melden Sie sich einfach an, und Ihr Instagram-Profil sowie Ihre Beiträge erscheinen statt des standardmäßigen Beispielinhalts.
Alternativ können Sie einen benutzerdefinierten Feed erstellen, indem Sie eine Reihe Hashtags und Profile hinzufügen, um deren Inhalte direkt auf Ihrer WordPress-Website anzuzeigen.
Layout auswählen. Passen Sie Ihren Instagram-Feed weiterhin an, indem Sie im linken Panel zur Registerkarte „Layout“ navigieren. Hier können Sie ein Layout wählen, das am besten zum Design Ihrer WordPress-Website passt. Passen Sie verschiedene Parameter an, damit Ihre Instagram-Beiträge für Ihre Besucher optimal angezeigt werden.
Elemente auswählen. Im Reiter „Post“ finden Sie zahlreiche Optionen, um Ihre Inhalte zu verfeinern. Sie können Funktionen wie Likes, Kommentare, Texte, CTA-Buttons und mehr ein- oder ausschalten. Zusätzlich können Sie Klick-Optionen festlegen und Muster für Popups definieren, um das Nutzererlebnis mit dem eingebetteten Instagram-Feed auf Ihrer WordPress-Website zu verbessern.
Farben festlegen. Sobald du die Elemente für deine Instagram-Beiträge definiert hast, gib ihnen im Instagram-Feed-Plugin den persönlichen Touch. Wähle aus vorkonfigurierten Farbpaletten oder passe deine eigenen Farben für jedes Element im Feed an, damit sie zum Branding deiner WordPress-Website passen.
Sprache auswählen. Im Reiter Einstellungen finden Sie eine Liste unterstützter Sprachen für das Instagram-Feed-Plugin. Wählen Sie eine Sprache aus, und die Widget-Elemente werden sofort in der von Ihnen gewählten Sprache angezeigt – für eine konsistente Erfahrung für Besucher Ihrer WordPress-Website.
Einen Einbettungscode erhalten. Um den Instagram-Feed auf Ihrer WordPress-Website anzuzeigen, klicken Sie auf die Schaltfläche ‘Kostenlos zur Website hinzufügen’, erhalten Sie einen automatisch generierten Code und fügen ihn einfach an der gewünschten Stelle Ihrer Seite ein. Ausführliche Hinweise zum Einbetten des Instagram-Feeds in WordPress finden Sie im nächsten Abschnitt.
So fügen Sie das Instagram-Feed-Widget zu einer bestimmten Seite Ihrer WordPress-Website hinzu
Nr. 1 über Seiten
Schau dir die Tutorials in unserem Video zu dieser beliebten Methode an, mit der du einen Instagram-Feed in WordPress-Seiten einbettest:
Oder lies die Textanleitungen, wenn dir das besser passt:
Gehen Sie zum Backend Ihrer WordPress-Website. Melden Sie sich im Backend Ihrer WordPress-Website an und klicken Sie auf Seiten.
Find the page you need to edit, click on the action button (…) and choose Bearbeiten:
Fügen Sie der Seite ein Code-Element hinzu. Im Editor finden Sie den Bereich, in dem Sie das Widget anzeigen möchten, und klicken Sie auf Block hinzufügen.
Fügen Sie den Installationscode ein. Fügen Sie Ihren Installationscode im Pop-up-Fenster ein und klicken Sie auf Aktualisieren, um Änderungen zu speichern:
Nr. 2 über Themes
Gehen Sie zum Backend Ihrer WordPress-Website. Melden Sie sich im Backend Ihrer WordPress-Website an, klicken Sie auf Design und wählen Sie Designvorlagen:
Find the theme you need to edit, click on the action button (…) and choose Edit:
Füge ein Code-Element zur Seite hinzu. Gehe zur Seiten-Registerkarte und wähle die Seite aus, zu der du das Widget hinzufügen möchtest.
Installationscode einfügen. Fügen Sie Ihren Installationscode im Popup-Fenster ein und klicken Sie auf Speichern, um Änderungen zu speichern:
So fügen Sie Ihren Instagram-Feed auf allen Seiten Ihrer WordPress-Website hinzu
#1 im Theme-Editor
Gehen Sie ins Backend Ihrer WordPress-Website. Melden Sie sich im Backend Ihrer WordPress-Website an. Gehen Sie im linken Menü zum Reiter Design und klicken Sie auf Theme Editor:
Installationscode hinzufügen. Wählen Sie die Datei footer.php im rechten Menü unter Theme-Dateien, fügen Sie den Code vor dem schließenden Body-Tag ein und klicken Sie auf die Schaltfläche Datei aktualisieren:
Nr. 2 über Widgets
“>Gehen Sie zum Backend Ihrer WordPress-Website. Melden Sie sich im Backend Ihrer WordPress-Website an. Gehen Sie zum Appearance-Tab im linken Menü und klicken Sie auf Widgets:
“>
Wählen Sie die Platzierung des Codes. Öffnen Sie Custom HTML (1) in der Liste Verfügbare Widgets, wählen Sie eine der Fußzeilen im Dropdown-Menü, zum Beispiel Footer One (2) und klicken Sie auf die Schaltfläche Widget hinzufügen (3):
‘>
Installationscode einfügen. Installationscode in das Inhalt-Feld einfügen und auf Speichern klicken, um die Änderungen zu übernehmen:
#3 über Anpassen
Gehen Sie zum Backend Ihrer WordPress-Website. Melden Sie sich im Backend Ihrer WordPress-Website an. Öffnen Sie im linken Menü den Tab Design und klicken Sie Anpassen:
Benutzerdefiniertes HTML-Element hinzufügen. Wählen Sie Widgets im linken Menü:
Klicken Sie unten im Menü auf Widget hinzufügen und wählen Sie im erscheinenden Menü Benutzerdefiniertes HTML aus:
“>
Nützliche Funktionen des Instagram-Feed-Widgets
Filter zum Anzeigen relevanter Galerien
Passen Sie Ihre Galerie so an, dass nur Beiträge angezeigt werden, die zu einer bestimmten Seite oder einem Produkt passen. Mit dem Elfsight-Widget können Sie mehrere Filter kombinieren, um das ideale Inhaltsraster zusammenzustellen. Zeigen Sie beispielsweise Beiträge ausschließlich von Offline-Veranstaltungen oder Inhalte zu Trendthemen hervor.
Handlungsaufrufe für mehr Engagement
CTA-Buttons in deinen Beiträgen hinzufügen, um gezielte Aktionen auszulösen und das Engagement zu steigern. Ob direkter Link zu einer Produktseite unter einem Werbepost oder zur Teilnahme an einer Veranstaltung – diese Buttons lassen sich passgenau auf deine Strategie und Ziele zuschneiden. Jeder Beitrag kann eine eigene, eindeutige Handlungsaufforderung enthalten.
Unbegrenzte Branding-Möglichkeiten
Elfsight bietet umfassende Anpassungsmöglichkeiten, damit Ihre Instagram-Einbettung für WordPress die Identität Ihrer Marke widerspiegelt. Egal, ob Sie mit etablierten Markenfarben arbeiten oder eine Palette auswählen, die zu Ihrem Stil und Ihren Aktivitäten passt, ermöglichen es Ihnen unsere vorgefertigten Farbschemata und flexible Einstellungen, eine Galerie zu erstellen, die ganz Ihnen gehört.
Vorlagen für das Elfsight Instagram-Feed-Widget
Das Elfsight Instagram Feed-Widget bietet eine Reihe großartiger Funktionen für Ihre WordPress-Website. So passen Sie Ihren Feed an, damit er auffällt.
Entdecken Sie eine Auswahl schöner, fertiger Instagram-Vorlagen in der kostenlosen Demo. Diese Vorlagen verleihen dem Look Ihrer Website deutlich mehr Glanz. Sie sind vollständig anpassbar und flexibel – Sie können den Stil Ihrer Instagram-Galerie vollständig verändern.
Instagram-Karussell
Das Karussell-Template von Elfsight bietet eine interaktive, ansprechende Möglichkeit, deine Instagram-Beiträge einzubetten. Mit einem dynamischen, kreisförmigen Format verwandelt dieses Template deinen Instagram-Feed in ein lebendiges Karussell-Plugin und verleiht deiner WordPress-Website eine spielerische, fesselnde Note. Indem Nutzer durch das Karussell scrollen, ermutigst du sie, deine Instagram-Inhalte gründlicher zu erkunden, was zu längeren Verweildauern auf deinen WordPress-Seiten und potenziell höheren Konversionsraten führen kann.
Instagram-Beitrags-Widget
Das Einzel-Instagram-Post-Widget bietet eine zielgerichtete, effektive Möglichkeit, einen bestimmten Instagram-Beitrag auf deiner WordPress-Website zu präsentieren. Es eignet sich ideal, um Inhalte hervorzuheben, die eine wichtige Botschaft oder das Thema deiner Website vermitteln, oder um Sonderangebote und Ankündigungen zu bewerben. Das Widget unterstützt dich beim nahtlosen Einbetten des Instagram-Feeds in WordPress – für eine reibungslose, kohärente Nutzererfahrung.
Instagram-Grid
Elfsight Grid-Vorlage bietet eine klare und strukturierte Möglichkeit, Ihre Instagram-Beiträge zu präsentieren. Das elegante quadratische Format eignet sich hervorragend, um Fotos und Videos ordentlich in einem Raster anzuordnen. Dieses Layout ist sowohl visuell ansprechend als auch praktisch und verfügt über eine ‘Mehr laden’-Schaltfläche, die Besucher dazu ermutigt, mehr von Ihren Inhalten zu entdecken. Die Grid-Vorlage aktualisiert sich automatisch mit neuen Instagram-Beiträgen, sodass Ihre WordPress-Website stets Ihre aktuellsten Inhalte anzeigt.
Hashtag-Feed
Ein Instagram-Feed präsentiert live nutzergenerierte Inhalte, die die Aktivität Ihrer Marke hervorheben. Dieser authentische Content dient als Social Proof und ermutigt potenzielle Kunden, Ihrer Marke zu vertrauen und zu handeln – sei es durch einen Kauf oder eine Anfrage für weitere Informationen. Mit fortschrittlichen Anpassungsoptionen bietet das Elfsight Instagram Feed-Widget unzählige Möglichkeiten, Ihre WordPress-Website zu verbessern, und macht Ihre Instagram-Inhalte zu einem herausragenden, fesselnden Feature.
Entdecken Sie diese und viele weitere fertige Designs in unserem hervorragenden Vorlagenkatalog ⬇
Vorlagenkatalog
Mehr als 70 Instagram-Feed-Vorlagen entdecken
Entdecken Sie weitere fertige Vorlagen für jeden Anwendungsfall oder erstellen Sie Ihre eigene!
Binden Sie ein anpassbares Instagram-Feed-Raster in Ihre Website ein, um die visuelle Attraktivität Ihrer Website zu steigern und die Markenbekanntheit zu stärken.
Das Einbetten eines Instagram-Feeds in Ihre WordPress-Website ist eine strategische Methode, um Engagement zu erhöhen und Markenbekanntheit zu steigern. Wir haben verschiedene Ansätze geprüft, um dieses Feature nahtlos zu integrieren, und dabei die Einfachheit und Effektivität des Elfsight Instagram Feed-Widgets hervorgehoben. Mit diesem Tool können Sie ganz einfach dynamische, Echtzeit-Inhalte anzeigen und Ihre Website ansprechender und interaktiver gestalten.
Indem Sie die besten Praktiken und Tipps umsetzen, die wir besprochen haben, verbessert der Instagram-Feed die Nutzererfahrung, steigert Conversions durch authentische Inhalte und stärkt Ihre Social-Media-Integration. Ganz gleich, ob Sie mehr Verweildauer auf Ihrer Website erreichen, Conversions erhöhen oder Ihre Followerbasis erweitern möchten – das Elfsight Instagram Feed-Widget ist eine leistungsstarke WordPress-Lösung, um diese Ziele zu erreichen.
FAQ (Häufig gestellte Fragen)
Wie bettet man einen Instagram-Feed mit Gutenberg in WordPress ein?
Starte den Gutenberg-Editor für die Instagram-Feed-Integration. Klicke oben rechts auf die Schaltfläche Hinzufügen, um die Funktionen des Gutenberg-Editors aufzurufen und deine Seite mit dem Instagram-Feed anzupassen.
Füge den Shortcode-Block ein. Gib in die Suchleiste „short“ ein und wähle den Shortcode-Block aus den vorgeschlagenen Optionen. Mit diesem Block kannst du deinen Instagram-Feed einbetten.
Den Shortcode einbetten. Klicken Sie mit der rechten Maustaste in den Shortcode-Block und wählen Sie Einfügen, um den Shortcode Ihres Instagram-Feeds einzufügen.
Veröffentliche deine Änderungen. Klicke oben rechts auf Veröffentlichen und klicke dann erneut Veröffentlichen, um deine Änderungen zu bestätigen.
Seite ansehen. Wählen Sie die Option Seite ansehen, um zu sehen, wie Ihr Instagram-Feed-Plugin auf Ihrer Website aussieht. Ihr Instagram-Feed ist jetzt erfolgreich eingebettet und wird auf Ihrer WordPress-Website angezeigt.
Wie bindet man einen Instagram-Feed in WordPress mit Elementor ein?
Starte den Elementor-Editor für die Instagram-Feed-Integration. Klicke auf die Schaltfläche ‘Mit Elementor bearbeiten’, um die Funktionen des Elementor-Editors zu nutzen und deine Seite mit dem Instagram-Feed anzupassen.
Fügen Sie das Instagram-Feed-Widget ein. Verwenden Sie die Drag‑and‑Drop-Funktion von Elementor, um das Instagram-Widget an der gewünschten Stelle im Seitenlayout zu platzieren.
Code einbetten. Fügen Sie einfach den Installationscode des Instagram-Feeds in das HTML-Code-Feld des Elementor-Editors ein. Klicken Sie nach diesem Schritt auf Aktualisieren, um Ihre Änderungen zu speichern und den Instagram-Feed auf Ihrer Seite zu aktivieren.
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.
“>Gehen Sie zum Backend Ihrer WordPress-Website. Melden Sie sich im Backend Ihrer WordPress-Website an. Gehen Sie zum Appearance-Tab im linken Menü und klicken Sie auf Widgets:
