So fügen Sie eine Facebook-Seite zu WordPress hinzu (3 einfache Wege) 

Immer wenn ich eine neue Website eingerichtet habe, verbinde ich als Nächstes ihre sozialen Kanäle. Ein Publikum baut sich nicht von selbst auf, und eine Website, die Facebook ignoriert, lässt die einfachsten Follower liegen.

Wenn Ihre Website und Ihre Facebook-Seite in zwei getrennten Welten existieren, verpassen Sie einfache Interaktionen und Follower.

Deshalb zeige ich dir meine drei zuverlässigsten Methoden, um eine Facebook-Seite zu WordPress hinzuzufügen. Ich zeige dir auch, wie du einen Facebook Like-Button hinzufügst, damit Besucher deiner Seite mit einem Klick folgen können, ohne deine Website verlassen zu müssen.

Warum Ihre Facebook-Seite zu WordPress hinzufügen?

Wenn Sie ein lokales Unternehmen oder eine Community-Seite betreiben, sind Ihre Besucher bereits täglich auf Facebook. Wenn Sie Ihre Facebook-Seite direkt auf Ihre Website einbinden, können sie diese liken oder ihr folgen, ohne die Website zu verlassen. Dieser reibungslose Moment ist der Punkt, an dem das meiste soziale Wachstum stattfindet.

Es hält Ihre Marke auch an zwei Orten gleichzeitig sichtbar, sodass neue Besucher, die Sie über Google finden, Sie in derselben Sitzung in sozialen Netzwerken verbinden können. Für ein lokales Unternehmen ist diese Kombination aus Sichtbarkeit in Suchmaschinen und sozialer Vernetzung kaum zu übertreffen.

Als Nächstes zeige ich Ihnen Schritt für Schritt, wie Sie sie hinzufügen.

Methode 1: Hinzufügen Ihrer Facebook-Seite zu WordPress mit SeedProd

Wenn Sie eine neue Seite von Grund auf neu erstellen, z. B. eine spezielle Social-Landingpage oder einen Facebook-Hub für Ihre Marke, ist SeedProd die beste Option. Sein Drag-and-Drop-Editor enthält einen integrierten Facebook-Seiten-Block, sodass Sie Ihre Seite einbetten und das gesamte Layout anpassen können, ohne Code schreiben zu müssen.

SeedProd ist der beste WordPress-Seitenersteller und Website-Builder mit Drag-and-Drop. Er ermöglicht Ihnen, benutzerdefinierte Seitenlayouts zu erstellen, ohne den Aufwand, sie von Grund auf neu zu programmieren.

Mit seinem Facebook Page-Block kannst du jede Facebook-Seite mit nur wenigen Klicks in WordPress einbetten. Er hat auch praktische Blöcke, mit denen du einen Facebook Like-Button, Facebook-Kommentare und Facebook-Posts einbetten kannst.

Hier sind die Schritte, wie Sie mit SeedProd eine Facebook-Seite zu WordPress hinzufügen.

Schritt 1. SeedProd installieren und aktivieren

Zuerst musst du das SeedProd-Plugin herunterladen und auf deiner WordPress-Website installieren.

Für diesen Leitfaden verwenden wir SeedProd Pro wegen seiner erweiterten Anpassungsfunktionen.

Wenn Sie Hilfe benötigen, finden Sie in unserer Dokumentation, wie Sie SeedProd installieren und Ihre Lizenz aktivieren.

SeedProd bietet 2 Möglichkeiten, Ihre WordPress-Website anzupassen. Sie können entweder eine eigenständige Landingpage erstellen oder mit seiner Theme Builder-Funktion ein benutzerdefiniertes WordPress-Theme erstellen.

Für diesen Leitfaden verwenden wir die Funktionalität des Landingpage-Builders.

Schritt 2. Wählen Sie eine Landingpage-Vorlage

Um eine neue Landingpage zu erstellen, navigiere zu 'Landingpages' in deinem WordPress-Dashboard und klicke auf die Schaltfläche 'Neue Landingpage hinzufügen'.

Von dort aus sehen Sie Hunderte von vorgefertigten Landingpage-Vorlagen, die Sie als Ausgangspunkt für Ihr Design verwenden können. Jede Vorlage ist zu 100 % mobilfreundlich und sorgt dafür, dass Ihr Design auf mobilen Geräten wie Smartphones und Tablets großartig aussieht.

Sie können die Vorlagen filtern, indem Sie auf die Registerkarten oben klicken, oder die Suchleiste verwenden, um ein Design für eine bestimmte Nische zu finden. Sobald Sie eine gefunden haben, die Ihnen gefällt, fahren Sie mit der Maus darüber und klicken Sie auf das Häkchensymbol.

Gib als Nächstes einen Namen für deine Seite ein und klicke auf die Schaltfläche 'Speichern und mit der Bearbeitung der Seite beginnen'.

Nun öffnet sich die Vorlage im visuellen Editor von SeedProd, wo Sie ihr Layout und ihren Inhalt ohne Code anpassen können.

Schritt 3. Fügen Sie den Facebook-Seiten-Block hinzu

Der Drag-and-Drop-Editor von SeedProd ist einfach zu bedienen.

Sie sehen eine Live-Vorschau auf der rechten Seite und Blöcke, Abschnitte und Einstellungen auf der linken Seite. Sie können Inhaltselemente aus dem Block-Panel in die Vorschau ziehen und deren Einstellungen mit wenigen Klicks bearbeiten.

So fügen Sie den Facebook-Seiten-Block zu Ihrer Landingpage hinzu:

Scrolle im Bedienfeld 'Erweiterte Blöcke' nach unten, bis du den Facebook Page-Block siehst. Um ihn zu deiner Seite hinzuzufügen, ziehe ihn von links und lasse ihn auf deiner Vorschau los.

Nun können Sie auf den Block klicken, um seine Anpassungsoptionen anzuzeigen und Ihre Facebook-Seiten-URL hinzuzufügen.

Wenn Ihre Seite nicht angezeigt wird, müssen Sie auf den Link „Seiteneinstellungen“ klicken und Ihre Facebook App ID-Informationen eingeben.

So erhalten Sie eine Facebook App ID

Die App-ID ist der einzige Teil, der fummelig erscheint, aber du richtest sie nur einmal ein.

So geht's:

1. Gehen Sie zu developers.facebook.com/apps und melden Sie sich mit Ihrem Facebook-Konto an.
2. Klicke auf 'App erstellen' und wähle den App-Typ 'Consumer', wenn du dazu aufgefordert wirst.
3. Geben Sie Ihren App-Namen und Ihre Kontakt-E-Mail-Adresse ein und schließen Sie dann den Einrichtungsassistenten ab.
4. Sobald die App erstellt ist, erscheint Ihre App ID oben im App-Dashboard. Kopieren Sie sie und fügen Sie sie in das Feld „Seiteneinstellungen“ von SeedProd ein.

Zusätzliche Einstellungen für den Facebook-Seiten-Block umfassen die Möglichkeit:

• Eine kleine Kopfzeile aktivieren
• Ihr Titelbild ausblenden
• Profilfotos anzeigen
• Die CTA-Schaltfläche ausblenden
• Die Höhe des Facebook-Widgets ändern
• Die Ausrichtung des Widgets anpassen

Sie können sogar verschiedene Arten von Facebook-Feeds anzeigen, darunter eine Zeitleiste, Veranstaltungen und Nachrichten.

Das Tolle an diesem Block ist, dass er automatisch „Gefällt mir“- und „Teilen“-Schaltflächen enthält, sodass Benutzer Ihre Social-Media-Inhalte problemlos auf anderen Plattformen teilen können.

Schritt 4. Passen Sie Ihre WordPress-Seite an

Sobald dein Facebook Page-Feed eingerichtet ist, kannst du den Rest deiner Landingpage weiter anpassen.

Einige Ideen sind:

• Hinzufügen eines Opt-in-Formulars zum Sammeln von E-Mail-Adressen

• Einbindung von Testimonials zufriedener Kunden zur Steigerung des Vertrauens
• Hinzufügen einer Schaltfläche zum Beitreten Ihrer Facebook-Gruppe

• Einbindung eines Willkommensvideos zur Einbindung von Erstbesuchern

Eine umfassende Anleitung zur Anpassung Ihrer Landingpage finden Sie in unserem Schritt-für-Schritt-Leitfaden zum Thema Erstellung einer Landingpage in WordPress.

Schritt 5. Änderungen speichern

Wenn du mit deiner Seite zufrieden bist, klicke auf die Schaltfläche 'Speichern' und 'Veröffentlichen' in der oberen rechten Ecke deines Bildschirms.

Nun können Sie die Seite besuchen, um zu sehen, wie sie aussieht.

Methode 2: Facebook-Seite ohne Plugin zu WordPress hinzufügen

Die zweite Methode verwendet das eigene Page Plugin von Facebook, sodass kein Page Builder beteiligt ist.

Diese Methode ist ebenfalls relativ einfach, bietet jedoch nicht das gleiche Maß an Anpassungsmöglichkeiten wie ein WordPress Page Builder. Sie beinhaltet auch das Kopieren und Einfügen von Code-Snippets auf Ihrer Website.

Schritt 1. Das Facebook Page Plugin erhalten

Besuchen Sie zunächst die Facebook Page Plugin-Website. Hier geben Sie die Details zu Ihrer Seite ein und generieren einen Code, den Sie auf Ihrer Website einbetten können.

Schritt 2. Das Facebook Page Plugin konfigurieren

Auf der Plugin-Seite sehen Sie ein Formular, in das Sie Details zu Ihrer Facebook-Seite eingeben können.

Sie können die URL Ihrer Facebook-Seite einfügen, eine benutzerdefinierte Breite und Höhe für das Plugin eingeben, das Titelbild ausblenden und mehr.

Schritt 3. Ihren Facebook Page Embed-Code generieren

Nachdem Sie die erforderlichen Details eingegeben haben, klicken Sie auf die Schaltfläche „Code abrufen“.

Facebook generiert nun einen JavaScript- und iFrame-Code, den Sie auf Ihrer Webseite einfügen können. Wählen Sie im Popup-Fenster die iFrame-Option und kopieren Sie den Einbettungscode.

Schritt 4. Den Facebook Page Embed-Code zu WordPress hinzufügen

Nun ist es an der Zeit, diesen Code zu Ihrem WordPress-Blog hinzuzufügen. Viele Websites zeigen ihre Facebook-Konto-Seite in einem neuen Beitrag oder Seitenleisten-Widget an, also schauen wir uns an, wie das geht.

Gehen Sie zum Tab „Design“ in Ihrem WordPress-Adminbereich und wählen Sie „Widgets“.

Klicken Sie als Nächstes auf das Plus-Symbol, um einen neuen WordPress-Block hinzuzufügen, und suchen Sie das Widget Benutzerdefiniertes HTML oder Text. Fügen Sie dieses Widget in den Bereich ein, in dem Ihre FB-Seite erscheinen soll.

Kopieren Sie schließlich den von Facebook generierten HTML-Code und fügen Sie ihn in den Widget-Bereich ein.

Klicken Sie nun auf die Schaltfläche „Speichern“, um die Änderungen zu übernehmen. Damit sollte Ihre Facebook-Seite nun in Ihrer WordPress-Seitenleiste erscheinen.

Um es stattdessen auf einer Seite oder in einem Beitrag hinzuzufügen, öffnen Sie die Seite im Block-Editor, klicken Sie auf die Schaltfläche „+“, um einen neuen Block hinzuzufügen, suchen Sie nach „Benutzerdefinierter HTML-Code“ und fügen Sie den Einbettungscode dort ein. Veröffentlichen Sie die Seite und Ihr Facebook-Feed wird genau dort angezeigt, wo Sie ihn platziert haben.

Wird nicht angezeigt? Überprüfen Sie zuerst, ob Ihre Facebook-Seite veröffentlicht ist und die eingegebene URL korrekt ist. Wenn ein Sicherheits- oder Caching-Plugin externe Skripte blockiert, versuchen Sie, es vorübergehend zu deaktivieren, um zu testen.

Der JavaScript-Einbettungscode von Facebook kann manchmal blockiert werden. Wechseln Sie daher zu Schritt 3 und verwenden Sie den iFrame-Code, falls dies geschieht. Stellen Sie außerdem sicher, dass die Domain, auf der Sie einbetten, mit der Domain übereinstimmt, die in Ihren Facebook-App-Einstellungen registriert ist.

Methode 3: Fügen Sie einen Facebook-Feed mit einem Plugin zu WordPress hinzu

Wenn Sie einen dynamischen, gestylten Feed wünschen, der sich automatisch aktualisiert, wenn Sie auf Facebook posten, ist das beste Option das Custom Facebook Feed Plugin von Smash Balloon. Es ist die beliebteste Lösung für diesen Anwendungsfall und funktioniert auf jeder vorhandenen Seite, jedem Beitrag oder jeder Seitenleiste.

Mit dem Facebook Feed Plugin können Sie eine filterbare Galerie Ihrer Facebook-Beiträge anzeigen, ohne Code schreiben zu müssen. Hier erfahren Sie, wie Sie es einrichten.

Schritt 1. Installieren Sie das Custom Facebook Feed Plugin

Gehen Sie in Ihrem WordPress-Dashboard zu Plugins » Neu hinzufügen und suchen Sie nach „Custom Facebook Feed by Smash Balloon“. Installieren und aktivieren Sie die kostenlose Version.

Nach der Aktivierung sehen Sie einen neuen Menüpunkt „Facebook Feed“ in Ihrem Dashboard.

Schritt 2. Verbinden Sie Ihr Facebook-Konto

Klicken Sie auf Facebook Feed » Neu hinzufügen, um den Einrichtungsassistenten zu starten. Sie werden aufgefordert, Ihr Facebook-Konto zu verbinden.

Klicken Sie auf „Mit Facebook verbinden“, melden Sie sich bei Bedarf an und gewähren Sie dem Plugin die Berechtigung, auf Ihre Seiten zuzugreifen.

Das Plugin fordert nur Lesezugriff an, sodass es Ihre Beiträge anzeigen kann, ohne die Möglichkeit zu haben, in Ihrem Namen zu posten.

Schritt 3. Wählen Sie Ihre Facebook-Seite aus

Nach der Verbindung sehen Sie eine Liste der Facebook-Seiten, die Sie verwalten. Wählen Sie die Seite aus, die Sie anzeigen möchten, und klicken Sie auf „Weiter“.

Der Assistent lässt Sie dann einen Feed-Typ auswählen: Timeline, Fotos, Events oder Videos. Sie können eine Vorschau anzeigen, wie es auf Ihrer Website aussehen wird.

Schritt 4. Kopieren Sie den Shortcode oder fügen Sie den Block hinzu

Sobald Ihr Feed konfiguriert ist, gibt Ihnen Smash Balloon einen Shortcode wie [custom-facebook-feed]. Sie können auch den dedizierten „Facebook Feed“-Block verwenden, wenn Sie den WordPress-Block-Editor verwenden.

Speichern Sie den Feed und notieren Sie sich den Shortcode oder den Blocknamen. Sie werden ihn im nächsten Schritt verwenden, um den Feed auf Ihrer Website zu platzieren.

Schritt 5. Platzieren Sie den Feed auf Ihrer Seite

Öffnen Sie die Seite oder den Beitrag, auf der/dem der Feed erscheinen soll. Wenn Sie den Block-Editor verwenden, klicken Sie auf die Schaltfläche „+“, suchen Sie nach „Facebook Feed“ und wählen Sie Ihren Feed aus dem Dropdown-Menü aus. Wenn Sie einen Shortcode verwenden, fügen Sie einen „Shortcode“-Block hinzu und fügen Sie ihn dort ein.

Um den Feed zu Ihrer Seitenleiste hinzuzufügen, gehen Sie zu Design » Widgets, fügen Sie ein „Shortcode“-Widget hinzu, fügen Sie den Shortcode ein und speichern Sie. Veröffentlichen Sie die Seite und Ihr Live-Facebook-Feed wird genau dort angezeigt, wo Sie ihn platziert haben.

Wie man einen Facebook Like-Button in WordPress hinzufügt

Ihre Seite einzubetten ist eine Sache. Besuchern eine Möglichkeit zu geben, ihr mit einem Klick zu folgen, ist eine andere, und genau das tut ein Facebook Like-Button.

Auf den Blogs, die ich betrieben habe, war ein „Gefällt mir“-Button der einfachste Weg, einen Leser zu einem Follower zu machen. Kommentieren und Teilen erfordern Mühe, aber ein „Gefällt mir“ ist ein Klick und lässt Ihre Seite im Hintergrund leise wachsen.

WordPress hat keinen integrierten „Gefällt mir“-Button. Ich zeige Ihnen daher zwei Möglichkeiten, einen hinzuzufügen. Der Code-freie Weg nutzt SeedProd. Der manuelle Weg nutzt den Facebook-eigenen Code.

Einen Facebook Like-Button mit SeedProd hinzufügen (ohne Code)

Wenn Sie Methode 1 gefolgt sind, haben Sie SeedProd bereits installiert und eine Seite im Builder geöffnet. Das Hinzufügen eines „Gefällt mir“-Buttons erfordert nur wenige weitere Klicks.

Neben dem Facebook-Seiten-Block können Sie mit den Facebook-Blöcken von SeedProd Ihre Seite, einzelne Beiträge, Kommentare und einen eigenständigen „Gefällt mir“-Button einbetten.

Um den Button hinzuzufügen, ziehen Sie den Facebook Like Block aus dem Panel „Erweiterte Blöcke“ auf Ihre Seite.

Klicken Sie auf den Block, um seine Einstellungen zu öffnen, wo Sie genau festlegen können, wie der Button aussieht. Sie können das Layout auf Standard, Button, Button-Anzahl oder Box-Anzahl einstellen.

Im selben Panel können Sie eine kleine oder große Größe wählen und einen Facebook-Teilen-Button daneben ein- oder ausschalten.

Sie können den Button auch auf Ihre aktuelle Seite oder eine benutzerdefinierte URL richten, das URL-Format zwischen einfachen und schönen Permalinks umschalten und den Button links, rechts oder mittig ausrichten.

Im Tab „Erweiterte Einstellungen“ können Sie den Abstand des Buttons feinabstimmen, ihn animieren und seine Sichtbarkeit auf Mobilgeräten und Desktops steuern, alles ohne Code schreiben zu müssen.

Hinweis: Damit der Button korrekt gerendert wird, fügen Sie Ihre Facebook App ID unter SeedProd » Einstellungen hinzu. Sie können diese ID von Ihrem App-Dashboard unter developers.facebook.com abrufen, demselben Ort, der in den Schritten zur App ID oben behandelt wurde.

Wenn Sie mit dem Button zufrieden sind, klicken Sie auf den Dropdown-Pfeil des „Speichern“-Buttons und wählen Sie „Veröffentlichen“.

Besuchen Sie nun Ihre Seite und sehen Sie den Facebook „Gefällt mir“-Button in Aktion.

Einen Facebook Like-Button manuell mit Code hinzufügen

Wenn Sie lieber kein Plugin verwenden möchten, können Sie den eigenen „Gefällt mir“-Button-Code von Facebook in WordPress einfügen. Dies erfordert ein paar zusätzliche Schritte, daher empfehle ich es nur, wenn Sie sich mit der Bearbeitung von Code wohlfühlen.

Um es sicherer zu machen, verwenden wir das WPCode Plugin. Es ermöglicht Ihnen, Code-Snippets zu verwalten, ohne Ihre Theme-Dateien direkt zu bearbeiten, sodass ein Theme-Update sie nicht löschen kann.

Gehen Sie zuerst zur Like Button-Seite auf der Meta for Developers-Website und scrollen Sie nach unten zum „Like Button Configurator“.

Geben Sie Ihre Facebook-Seiten-URL in das Feld „URL to Like“ ein, passen Sie dann das Layout und die Größe an, bis die Vorschau richtig aussieht. Wenn Sie zufrieden sind, klicken Sie auf „Get Code“.

Sie sehen ein Popup mit zwei Tabs, JavaScript SDK und iFrame, und zwei Code-Snippets. Klicken Sie auf die JavaScript-Option.

Installieren und aktivieren Sie nun das WPCode-Plugin. Gehen Sie dann in Ihrem Dashboard zu Code Snippets » Header & Footer.

Kopieren Sie das erste Snippet von Facebook, fügen Sie es in den „Body“-Bereich ein und klicken Sie auf „Save Changes“.

Als Nächstes fügen Sie das zweite Snippet hinzu, das tatsächlich den Button anzeigt. Gehen Sie zu Code Snippets » + Add Snippet, wählen Sie „Add Your Custom Code (New Snippet)“ und klicken Sie dann auf „Use snippet“.

Geben Sie dem Snippet einen Namen, fügen Sie das zweite Facebook-Snippet in das Feld „Code-Vorschau“ ein und stellen Sie den „Code-Typ“ auf „HTML-Snippet“ ein.

Scrollen Sie nach unten zum Abschnitt „Einfügen“, um auszuwählen, wo der Button angezeigt wird. Um ihn über Ihren Beiträgen anzuzeigen, öffnen Sie das Dropdown-Menü „Position“ und wählen Sie unter „Seiten-spezifisch“ die Option „Vor dem Inhalt einfügen“.

Klicken Sie abschließend auf „Snippet speichern“ und schalten Sie den Schalter von Inaktiv auf „Aktiv“. Besuchen Sie einen beliebigen Blogbeitrag, und Ihr Facebook-Like-Button wird vor dem Inhalt angezeigt.

FAQs zum Hinzufügen einer Facebook-Seite zu WordPress

Was ist der einfachste Weg, meine Facebook-Seite in WordPress anzuzeigen?

Wenn Sie bereits einen Seiten-Builder wie SeedProd verwenden, ist dessen Facebook-Seiten-Block der schnellste Weg. Andernfalls fügen Sie Ihre Seiten-URL in das Facebook Page Plugin-Tool ein, kopieren Sie den Code und fügen Sie ihn in einen Custom HTML-Block oder ein Widget ein.

Wie füge ich meine Facebook-Seite zur WordPress-Seitenleiste oder zum Footer hinzu?

Gehen Sie zu Design » Widgets, fügen Sie einen Custom HTML-Block zu Ihrer Seitenleiste oder Ihrem Footer hinzu, fügen Sie Ihren Facebook-Seiten-Einbettungscode ein und speichern Sie.

Warum wird meine Facebook-Seite nicht eingebettet angezeigt?

Stellen Sie sicher, dass Ihre Seite veröffentlicht ist, die URL korrekt ist und kein Sicherheitspaket oder keine Theme-Einstellung Skripte blockiert. Wenn sie immer noch nicht angezeigt wird, versuchen Sie, den iFrame-Code von Facebook anstelle von JavaScript zu verwenden.

Verlangsamt das Hinzufügen einer Facebook-Seite zu WordPress meine Website?

Das kann es, da die Skripte von Facebook von außerhalb Ihrer Website geladen werden. Um die Dinge schnell zu halten, platzieren Sie die Einbettung weiter unten auf der Seite, begrenzen Sie die Anzahl der angezeigten Tabs und verwenden Sie Caching.

Ist ein Facebook Like-Button dasselbe wie ein Share-Button?

Nicht ganz. Der Like-Button fügt Ihre Seite zu den Facebook-Likes einer Person hinzu, während ein Share-Button Ihre Seite auf deren Zeitachse veröffentlicht. Mit SeedProds Facebook Like-Block können Sie beides zusammen anzeigen.

Wo sollte ich einen Facebook Like-Button platzieren?

Ich platziere ihn normalerweise am Ende einer Landingpage oder direkt unter dem Titel eines Blogbeitrags. Beide Stellen erhalten tendenziell mehr Klicks als die Seitenleiste.

Entdecken Sie als Nächstes weitere Möglichkeiten, Ihre WordPress-Website anzupassen

Wir hoffen, dieser Leitfaden hat Ihnen geholfen zu lernen, wie Sie eine Facebook-Seite zu WordPress hinzufügen. Es gibt so viele andere Möglichkeiten, Ihre WordPress-Website mit SeedProd anzupassen, dass wir sie unmöglich alle in einem Beitrag auflisten konnten.

Hier sind also einige unserer Top-WordPress-Anpassungsleitfäden:

• So passen Sie WordPress-Menüstile in 3 einfachen Schritten an
• So erstellen Sie eine benutzerdefinierte WordPress-Autorenseite (2 einfache Wege)
• So erstellen Sie personalisierte Landing Pages zur Steigerung der Konversionen
• Facebook-Videos in WordPress einbetten (3 einfache Wege)
• So erstellen Sie animierte Particle.js-Hintergründe in WordPress

Danke fürs Lesen! Wir würden uns freuen, Ihre Gedanken zu hören. Treten Sie also gerne der Unterhaltung auf YouTube, X und Facebook bei, um weitere hilfreiche Ratschläge und Inhalte für das Wachstum Ihres Unternehmens zu erhalten.