So erstellen Sie einen benutzerdefinierten Facebook-Feed in WordPress

Beim Erstellen von Websites fügen wir manchmal den Facebook-Feed der Marke zu einer ihrer Seiten hinzu. Dies ermöglicht es Besuchern, die neuesten Updates, Ankündigungen und Community-Interaktionen anzuzeigen, ohne die Website zu verlassen.

Obwohl manuelle Methoden existieren, sind sie nicht die effizienteste Methode, um Facebook-Inhalte anzuzeigen.

Viele unserer Leser haben nach dieser Funktion gefragt, und nach der Prüfung verschiedener Optionen haben wir uns für Smash Balloon für unsere benutzerdefinierten Facebook-Feeds entschieden. Es ist benutzerfreundlich, vollgepackt mit Funktionen und eignet sich für WordPress-Benutzer aller Niveaus.

In diesem Leitfaden führen wir Sie durch die Erstellung eines benutzerdefinierten Facebook-Feeds in WordPress mit unserer bewährten Methode.

Warum einen benutzerdefinierten Facebook-Feed in WordPress erstellen?

Laut unserem Bericht über Social-Media-Statistiken hat Facebook über 3 Milliarden monatlich aktive Nutzer. Das macht es zur größten Social-Media-Seite der Welt. Als Website-Betreiber haben Sie möglicherweise bereits eine Facebook-Seite oder -Gruppe erstellt, auf der Sie mit Ihrem Publikum interagieren.

Personen, die Ihre Website nur besuchen, sehen Ihre Facebook-Beiträge jedoch nicht. Durch das Hinzufügen eines benutzerdefinierten Facebook-Feeds können Sie Besuchern zeigen, was in Ihrer Gruppe oder auf Ihrer Seite passiert.

Dies kann Ihre Website ansprechender und interessanter machen, insbesondere wenn Sie Multimedia-Inhalte wie Videos und Bilder auf Facebook veröffentlichen.

Es ist auch eine großartige Möglichkeit, Ihre Facebook-Seite oder -Gruppe zu bewerben, was Ihnen helfen wird, mehr Facebook-Likes zu erhalten und Ihre Followerzahl zu erhöhen.

Mit diesem Wissen sehen wir uns an, wie Sie einen benutzerdefinierten Facebook-Feed zu Ihrer WordPress.org-Site hinzufügen. Sie können die Schnelllinks unten verwenden, um diese Schritt-für-Schritt-Anleitung zu navigieren:

• Schritt 1: Installieren Sie das Smash Balloon Custom Facebook Feed Plugin
• Schritt 2: Verbinden Sie Ihre Facebook-Seite oder -Gruppe mit WordPress
• Schritt 3: Erstellen Sie einen benutzerdefinierten Facebook-Feed in WordPress
• Schritt 4: Passen Sie Ihren Facebook-Feed an
• Schritt 5: Fügen Sie Ihren benutzerdefinierten Facebook-Feed zu WordPress hinzu
• Bonus-Tipp: So fügen Sie weitere Social-Media-Feeds zu WordPress hinzu

Schritt 1: Installieren Sie das Smash Balloon Custom Facebook Feed Plugin

Der beste und anfängerfreundlichste Weg, einen benutzerdefinierten Facebook-Feed zu Ihrer WordPress-Website hinzuzufügen, ist die Verwendung des Smash Balloon Custom Facebook Feed plugin.

Dieses Facebook-Plugin ermöglicht es Ihnen, Ihre Inhalte und Kommentare direkt auf Ihrer Website anzuzeigen und sogar Beiträge aus mehreren Facebook-Feeds zu kombinieren. Es erleichtert auch die Anzeige von aussagekräftigem Social Proof durch Einbetten von Facebook-Bewertungen und Community-Beiträgen auf Ihrer Website.

Das Erste, was Sie tun müssen, ist, das Smash Balloon Custom Facebook Feed Pro Plugin zu installieren und zu aktivieren. Weitere Details finden Sie in unserem Leitfaden zur Installation eines WordPress-Plugins.

In diesem Beitrag verwenden wir die Pro-Version von Smash Balloon, da sie es Ihnen ermöglicht, Videos und Fotos in Ihrem Facebook-Feed anzuzeigen, verschiedene Layouts auszuwählen, Ihren Feed nach Beitragstyp zu filtern und mehr.

Es gibt jedoch auch eine kostenlose Version, mit der Sie unabhängig von Ihrem Budget einen benutzerdefinierten Facebook-Feed für WordPress erstellen können.

Nach der Aktivierung müssen Sie zu Facebook Feed » Einstellungen gehen und Ihren Lizenzschlüssel in das Feld „Lizenzschlüssel“ eingeben.

Diese Informationen finden Sie in Ihrem Konto auf der Smash Balloon-Website.

Nach Eingabe des Schlüssels klicken Sie einfach auf die Schaltfläche „Aktivieren“.

Schritt 2: Verbinden Sie Ihre Facebook-Seite oder -Gruppe mit WordPress

Smash Balloon Custom Facebook Feed ermöglicht es Ihnen, mehrere Feeds von Ihren verschiedenen Facebook-Seiten und -Gruppen zu erstellen. Sie können Feeds sogar zusammenführen, um einen benutzerdefinierten Feed zu erstellen.

Um Ihren ersten Feed zu erstellen, gehen Sie zu Facebook Feed » Alle Feeds und klicken Sie dann auf „Neu hinzufügen“.

Smash Balloon ermöglicht es Ihnen, Facebook-Alben, Beiträge aus Ihrer Timeline, Videos, Events und mehr anzuzeigen. Für diesen Leitfaden erstellen wir einen „Timeline“-Facebook-Feed, aber Sie können jeden Feed-Typ auswählen, den Sie möchten.

Nachdem Sie einen Feed-Typ ausgewählt haben, klicken Sie auf die Schaltfläche „Weiter“.

Nun müssen Sie die Facebook-Seite oder -Gruppe auswählen, von der Sie die Inhalte abrufen möchten.

Um zu beginnen, klicken Sie auf „Neu hinzufügen“.

Wählen Sie auf dem nächsten Bildschirm, ob Sie einen Facebook-Gruppen-Feed in WordPress einbetten oder einen Facebook-Seiten-Feed erstellen möchten.

Klicken Sie dann einfach auf 'Mit Facebook verbinden'.

Dies öffnet ein Popup, in dem Sie sich bei Ihrem Facebook-Konto anmelden und die Seiten oder Gruppen auswählen können, die Sie in Ihrem Feed verwenden möchten.

Nachdem Sie Ihre Auswahl getroffen haben, klicken Sie auf die Schaltfläche „Weiter“.

Sobald Sie dies getan haben, zeigt Facebook alle Informationen an, auf die Smash Balloon zugreifen kann, und die Aktionen, die es ausführen kann.

Um den Zugriff von Smash Balloon auf Ihr Facebook-Konto einzuschränken, klicken Sie einfach auf einen der Schalter, um sie von „Ja“ auf „Nein“ zu stellen. Beachten Sie jedoch, dass dies den Inhalt beeinträchtigen kann, den Sie im Social-Media-Feed anzeigen können.

In diesem Sinne empfehlen wir, alle diese Schalter aktiviert zu lassen.

Wenn Sie bereit sind, klicken Sie auf 'Fertig'.

Nach einigen Momenten sollten Sie eine Meldung sehen, dass Sie Ihre WordPress-Website erfolgreich mit Facebook verknüpft haben. Sie können nun auf 'OK' klicken.

Wenn dies erledigt ist, kehrt Smash Balloon automatisch zu Ihrem WordPress-Dashboard zurück.

Schritt 3: Erstellen Sie einen benutzerdefinierten Facebook-Feed in WordPress

Sie sehen nun ein Popup mit der Gruppe oder Seite, die Sie gerade mit Ihrer WordPress-Website verknüpft haben. Wählen Sie einfach den Radiobutton neben Ihrer Quelle aus und klicken Sie dann auf die Schaltfläche „Hinzufügen“.

Wenn Sie das Popup versehentlich geschlossen haben, geraten Sie nicht in Panik. Sie können den Tab einfach aktualisieren, um das Popup wieder zu öffnen.

Sobald Sie dies getan haben, werden Sie zur Seite Facebook Feed » Alle Feeds zurückgeleitet.

Klicken Sie wie zuvor auf die Schaltfläche „Neu hinzufügen“ und wählen Sie dann die Art des benutzerdefinierten Facebook-Feeds aus, den Sie erstellen möchten, z. B. Timeline, Fotos oder Videos.

Klicken Sie dann auf „Weiter“. Unter „Quelle auswählen“ sehen Sie nun Ihre Facebook-Gruppe oder -Seite als Option.

Wählen Sie die Seite oder Gruppe aus und klicken Sie dann auf „Weiter“.

Sie können nun die Vorlage auswählen, die Sie als Ausgangspunkt für Ihren Feed verwenden möchten. Alle diese Vorlagen sind vollständig anpassbar, sodass Sie sie perfekt an Ihr WordPress-Blog oder Ihre Website anpassen können.

Wir werden die Vorlage „Standard“ verwenden, aber Sie können jede beliebige Vorlage verwenden.

Nach der Auswahl eines Designs klicken Sie auf die Schaltfläche „Weiter“.

Smash Balloon erstellt nun einen Facebook-Feed basierend auf Ihrer Quelle und der ausgewählten Vorlage. Dies ist ein guter Anfang, aber Sie möchten vielleicht feinabstimmen, wie dieser Feed auf Ihrer Website angezeigt wird.

Schritt 4: Passen Sie Ihren Facebook-Feed an

Das Smash Balloon Custom Facebook Feed Plugin bietet Ihnen viele Anpassungsoptionen, um Ihren Feed zu bearbeiten. In diesem Sinne lohnt es sich zu sehen, welche Änderungen Sie vornehmen können.

Suchen Sie auf dem Bildschirm Facebook Feed » Alle Feeds den Feed, den Sie gerade erstellt haben, und klicken Sie auf die Schaltfläche „Bearbeiten“, die wie ein kleiner Bleistift aussieht.

Dies öffnet den Feed-Editor, der eine Vorschau darauf anzeigt, wie der benutzerdefinierte Facebook-Feed auf Ihrer Website aussehen wird. Hier sehen Sie alle eingebetteten Facebook-Videos, Status-Updates und andere Inhalte, die auf Ihrer WordPress-Website angezeigt werden.

Auf der linken Seite sehen Sie alle verschiedenen Einstellungen, mit denen Sie den Feed anpassen können. Die meisten dieser Einstellungen sind selbsterklärend, aber wir werden einige Schlüsselbereiche kurz behandeln.

Um zu beginnen, können Sie die Anzeige Ihrer Beiträge ändern, indem Sie auf „Feed-Layout“ klicken.

Auf diesem Bildschirm können Sie zwischen verschiedenen Layouts wechseln und die Feed-Höhe ändern. Sie können sogar einen responsiven Slider erstellen, indem Sie das Layout „Karussell“ auswählen.

Während Sie Änderungen vornehmen, wird die Vorschau automatisch aktualisiert, sodass Sie verschiedene Einstellungen ausprobieren können, um zu sehen, was für Ihre Website am besten funktioniert.

Standardmäßig zeigt der Feed die gleiche Anzahl von Beiträgen auf Desktop-Computern und mobilen Geräten wie Smartphones an.

Mobile Geräte haben jedoch normalerweise kleinere Bildschirme und weniger Verarbeitungsleistung, daher möchten Sie möglicherweise weniger Beiträge auf Tablets und Smartphones anzeigen. Geben Sie dazu einfach eine andere Zahl in das Feld 'Mobile' unter 'Anzahl der Beiträge' ein.

Sie können mit der Reihe von Schaltflächen in der oberen rechten Ecke eine Vorschau anzeigen, wie Ihre Änderungen auf Desktop-Computern, Tablets und Smartphones aussehen werden.

Durch das Ausprobieren verschiedener Layouts können Sie einen benutzerdefinierten Feed erstellen, der gut aussieht, unabhängig davon, welches Gerät der Besucher verwendet.

Standardmäßig zeigt der Facebook-Feed auf Smartphones und Tablets weniger Spalten an als auf Desktop-Computern. Dies hilft dabei, dass alle Ihre Inhalte bequem auf kleineren Bildschirmen Platz finden.

Nach dem Testen der mobilen Version Ihrer WordPress-Website sind Sie möglicherweise unzufrieden damit, wie die Spalten auf Smartphones und Tablets aussehen. Wenn dies der Fall ist, können Sie die Spalten anpassen, indem Sie die Zahlen im Abschnitt „Spalten“ ändern.

Wenn Sie mit den vorgenommenen Änderungen zufrieden sind, klicken Sie oben im Menü auf den Link „Anpassen“.

Dies bringt Sie zurück zum Haupteditor von Smash Balloon.

Als Nächstes können Sie im linken Menü auf „Farbschema“ klicken und sich die verschiedenen Farben ansehen, die Sie dem Facebook-Feed hinzufügen können.

Standardmäßig verwendet Smash Balloon ein Farbschema, das von Ihrem WordPress-Theme übernommen wird, aber Sie können auch „Hell“ oder „Dunkel“ wählen oder sogar Ihr eigenes benutzerdefiniertes Farbschema erstellen.

Sie könnten zum Beispiel die Textfarbe ändern, damit sie sich vom Hintergrund Ihres Themes abhebt.

Standardmäßig fügt Smash Balloon Ihrem Feed eine Kopfzeile hinzu, die Ihr Facebook-Profilbild und den Namen Ihrer Seite oder Gruppe ist. Dies kann zusätzlichen Kontext bieten, anstatt einfach Ihre Facebook-Timeline in WordPress anzuzeigen.

Um das Aussehen zu ändern, klicken Sie im linken Menü auf „Header“.

Auf diesem Bildschirm können Sie die Größe und Farbe der Kopfzeile ändern, Ihr Facebook-Profilbild ein- oder ausblenden und vieles mehr.

Wenn Sie die Kopfzeile vollständig entfernen möchten, klicken Sie auf den Schalter, um ihn von Blau (aktiviert) auf Grau (deaktiviert) zu ändern.

Als Nächstes kommt der Bildschirm „Beiträge“. Hier können Sie ändern, wie die einzelnen Beiträge im benutzerdefinierten Facebook-Feed aussehen.

Sie können beispielsweise zwischen regulären und umrandeten Stilen wechseln, die Hintergrundfarbe ändern, einen Schatten hinzufügen und mehr.

Standardmäßig enthält Smash Balloon nicht den Facebook „Gefällt mir“-Button in Ihrem Feed.

Um mehr Besucher zu ermutigen, Ihrer Facebook-Seite zu folgen, möchten Sie vielleicht diesen Button hinzufügen, indem Sie im linken Menü des Editors „Like Box“ auswählen.

Danach klicken Sie einfach auf die Schaltfläche „Aktivieren“, sodass sie blau wird. Wenn Sie nun zum Ende der Vorschau scrollen, sehen Sie eine „Gefällt mir“-Schaltfläche.

Sie können diesen Bereich mit verschiedenen Einstellungen gestalten. Sie können zum Beispiel wählen, ob der Button oben oder unten im Feed angezeigt wird und ob das Titelbild Ihrer Facebook-Seite einbezogen werden soll.

Wenn Sie mit dem Aussehen des 'Gefällt mir'-Buttons zufrieden sind, können Sie zum Bildschirm 'Mehr laden'-Button wechseln.

Die Schaltfläche 'Mehr laden' ermutigt Besucher, mehr von Ihrem Facebook-Feed zu durchsuchen.

Aus diesem Grund möchten Sie die Schaltfläche möglicherweise auffälliger gestalten, indem Sie die Hintergrundfarbe, Textfarbe und Beschriftung ändern.

Eine weitere Option ist, die Schaltfläche „Mehr laden“ vollständig zu entfernen, indem Sie auf den Umschalter „Aktivieren“ klicken, sodass er grau wird.

Das Deaktivieren der Schaltfläche „Mehr laden“ ist nützlich, wenn Ihr Facebook-Feed zeitkritisch ist. Wenn Sie zum Beispiel hauptsächlich über Ihren Facebook-Veranstaltungskalender posten, müssen Besucher möglicherweise nicht durch Ihre früheren Beiträge scrollen, da diese nicht mehr relevant sind.

Wenn Sie mit der Einrichtung des benutzerdefinierten Facebook-Feeds zufrieden sind, vergessen Sie nicht, auf „Speichern“ zu klicken, um Ihre Änderungen zu speichern.

Sie sind nun bereit, den Facebook-Feed zu Ihrer WordPress-Website hinzuzufügen.

Schritt 5: Fügen Sie Ihren benutzerdefinierten Facebook-Feed zu WordPress hinzu

Um Facebook-Feeds in WordPress einzubetten, klicken Sie neben „Speichern“ auf die Schaltfläche „Einbetten“.

Sie sehen nun zwei Optionen, um Ihren Facebook-Feed hinzuzufügen: Shortcode oder Block.

Nach unserer Erfahrung ist es einfacher, Ihren Facebook-Feed über einen Block einzufügen. Dazu können Sie entweder auf „Zu einer Seite hinzufügen“ oder „Zu einem Widget hinzufügen“ klicken, wenn Ihr Theme einen Widget-fähigen Bereich hat.

Unser Leitfaden verwendet beispielhaft die Schaltfläche „Zu einer Seite hinzufügen“.

Nun müssen Sie eine Seite auswählen, auf die der Facebook-Feed eingefügt werden soll.

Wählen Sie einfach eine aus und klicken Sie auf „Hinzufügen“.

Sie werden zum Block-Editor weitergeleitet. Klicken Sie danach einfach auf die Schaltfläche „+ Block hinzufügen“ und suchen Sie nach dem Facebook-Feed-Block.

In diesem Stadium können Sie es einfach per Drag & Drop verschieben, wo immer es am besten aussieht.

Sobald Sie dies getan haben, wählen Sie eine Facebook-Feed-Quelle aus.

So:

Ihr Facebook-Feed sollte nun angezeigt werden.

Klicken Sie einfach auf „Aktualisieren“, um die Änderungen zu übernehmen.

Wenn Sie die Shortcode-Methode verwenden möchten, können Sie den Shortcode aus dem Popup 'Feed einbetten' kopieren.

Fügen Sie dann einfach den Shortcode in einen Shortcode-Block im Inhaltseditor ein, wenn Sie eine WordPress-Seite, einen Beitrag oder ein Widget bearbeiten. Klicken Sie anschließend auf „Aktualisieren“.

Weitere Informationen zum Platzieren des Shortcodes finden Sie in unserem Leitfaden zum Hinzufügen eines Shortcodes in WordPress.

Bonus-Tipp: So fügen Sie weitere Social-Media-Feeds zu WordPress hinzu

Wenn Sie Facebook-Statusbeiträge in WordPress einbetten, Ihre Timeline anzeigen, Facebook-Alben anzeigen und mehr möchten, dann ist Custom Facebook Feed das beste WordPress-Plugin dafür.

Viele Websites haben jedoch mehrere Social-Media-Konten, wie z. B. einen YouTube-Kanal, ein Twitter-Profil und ein Instagram-Konto. Wenn Sie für jede Plattform einzigartige Inhalte erstellen, ist es sinnvoll, diese Inhalte auf Ihrer WordPress-Website anzuzeigen.

Sie können die neuesten Videos von Ihrem YouTube-Kanal in WordPress anzeigen mit dem kostenlosen Smash Balloon Feeds for YouTube Plugin.

Mit mehr als 1 Milliarde aktiven Nutzern pro Monat ist Instagram ein großartiger Ort, um Ihre Produkte, Dienstleistungen und Blogbeiträge zu bewerben.

Wenn Sie ein Instagram-Konto haben, können Sie einen benutzerdefinierten Instagram-Feed erstellen und ihn dann zu jeder Webseite, jedem Beitrag oder jedem Widget-fähigen Bereich hinzufügen. Sie können sogar Instagram-Produktbilder in WordPress hinzufügen. 

Wir hoffen, dieser Artikel hat Ihnen geholfen, einen benutzerdefinierten Facebook-Feed in WordPress hinzuzufügen. Möglicherweise möchten Sie auch unseren ultimativen Leitfaden zum sozialen Handel für WordPress-Benutzer und unseren Artikel über das automatische Posten auf Facebook über WordPress lesen.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.