Wie man einen Facebook-Veranstaltungskalender in WordPress hinzufügt (einfache Methode)

Sie haben vielleicht einen vollen Terminkalender auf Facebook, aber Besucher auf Ihrer WordPress-Seite werden das nicht wissen, es sei denn, Sie zeigen diese Termine direkt auf Ihren Seiten an.

Ein Facebook-Veranstaltungsfeed löst dieses Problem, indem er Veranstaltungen direkt von Ihrer Facebook-Seite abruft und sie automatisch auf Ihrer Website anzeigt.

Diese Anleitung führt Sie durch die gesamte Einrichtung, von der Erstellung der erforderlichen Facebook-App bis zur Anpassung Ihres fertigen Kalenders.

Sie können diese Schnelllinks verwenden, um durch die Schritte zu navigieren:

Schritt 1: Fügen Sie ein Facebook-Veranstaltungs-Plugin in WordPress hinzu

Um Facebook-Veranstaltungen in WordPress anzuzeigen, benötigen Sie das Smash Balloon Facebook Feed Plugin. Dieses Plugin ermöglicht es Ihnen, Ihre Facebook-Posts, Fotos, Videos und Alben direkt auf Ihrer WordPress-Website anzuzeigen.

Es gibt auch ein kostenloses Smash Balloon Social Post Feed Plugin, das Sie aus dem offiziellen WordPress-Repository herunterladen können. Sie müssen jedoch auf die Elite-Lizenz (149 $/Jahr) upgraden, um Facebook-Veranstaltungen anzuzeigen.

Sobald Sie Ihre Lizenz haben, können Sie das Plugin installieren und aktivieren. Unser Leitfaden zur Installation eines WordPress-Plugins führt Sie Schritt für Schritt durch den Prozess.

Gehen Sie nach der Aktivierung zu Facebook Feed » Einstellungen, fügen Sie Ihren Schlüssel in das Feld Lizenzschlüssel ein und klicken Sie auf Aktivieren.

Schritt 2: Facebook mit WordPress verbinden und einen Events-Zugriffstoken erstellen

Facebook behandelt Seitenereignisse als eingeschränkte Daten, daher kann Smash Balloon sie nicht automatisch wie Standardbeiträge abrufen. Stattdessen müssen Sie eine einfache Facebook-App erstellen, ein Zugriffstoken generieren und dieses Token zum Plugin hinzufügen.

Stellen Sie vor Beginn sicher, dass Ihr persönliches Facebook-Konto über Administratorzugriff auf die Facebook-Seite verfügt, auf der Ihre Ereignisse gehostet werden. Wenn Sie kein Administrator sind, wird die Einrichtung ohne Fehlermeldung abgeschlossen, aber Ihr Kalender bleibt vollständig leer.

Als Meta-Entwickler registrieren

Gehen Sie zunächst auf die Meta for Developers-Website und klicken Sie in der oberen rechten Ecke auf „Anmelden“. Sie müssen sich mit dem persönlichen Facebook-Profil anmelden, das Ihre Seite verwaltet, da Facebook nur Einzelpersonen erlaubt, sich als Entwickler zu registrieren, nicht Unternehmen.

Wenn Sie zum ersten Mal hier sind, klicken Sie auf „Neues Konto erstellen“ und folgen Sie den Anweisungen auf dem Bildschirm.

Facebook wird Sie bitten, die Entwicklerbedingungen zu akzeptieren, Ihre Telefonnummer per SMS zu verifizieren und Ihre E-Mail-Adresse zu bestätigen. Sobald dies abgeschlossen ist, werden Sie von Facebook zum App-Dashboard weitergeleitet.

Erstellen Sie Ihre Facebook-App und fügen Sie ihre Berechtigungen hinzu

Klicken Sie auf der Seite „Apps“ in der oberen rechten Ecke auf „App erstellen“.

Geben Sie auf dem Bildschirm „App-Details“ einen Namen für Ihre App und Ihre Kontakt-E-Mail-Adresse ein. Der Name ist nur für Sie sichtbar, daher ist etwas Einfaches wie „Meine Ereignisse“ in Ordnung.

Klicken Sie auf „Weiter“, um fortzufahren.

Wählen Sie auf dem Bildschirm „Anwendungsfälle hinzufügen“ im linken Menü „Content-Management“ aus.

Wählen Sie, wenn es erscheint, „Alles auf Ihrer Seite verwalten“ aus.

Klicken Sie auf „Weiter“.

Auf dem Bildschirm „Unternehmen“ können Sie ein Unternehmensportfolio verbinden, falls Sie eines verwenden. Da dieser Teil optional ist, können Sie auch „Ich möchte noch kein Unternehmensportfolio verbinden“ auswählen und auf „Weiter“ klicken.

Klicken Sie auf dem Bildschirm „Anforderungen“ auf „Weiter“, um zu bestätigen, dass keine zusätzlichen Veröffentlichungsanforderungen gelten.

Überprüfen Sie abschließend Ihre Einstellungen auf dem Bildschirm „Übersicht“ und klicken Sie auf „App erstellen“.

Dies öffnet das Dashboard Ihrer neuen App. Klicken Sie von hier aus auf „Anwendungsfall ‚Alles auf Ihrer Seite verwalten‘ anpassen“.

Auf dieser Seite werden Sie feststellen, dass die Berechtigungen pages_show_list und business_management bereits für Sie ausgewählt sind.

Klicken Sie in der Liste neben jeder dieser Berechtigungen auf „Hinzufügen“:

• pages_read_user_content
• pages_read_engagement
• pages_manage_engagement

Nach dem Hinzufügen zeigen alle drei den Status „Bereit zum Testen“ an.

Da die Anzeige von Facebook-Ereignis-Feeds keine Überprüfung oder Veröffentlichung Ihrer App durch Facebook erfordert, können Sie Ihre App sicher im Entwicklermodus belassen.

Generieren Sie Ihr Token und verbinden Sie Ihre Seite

Gehen Sie in der linken Seitenleiste Ihrer App zu App-Einstellungen » Allgemein.

Hier finden Sie die Felder „App-ID“ und „App-Secret“.

Klicken Sie auf „Anzeigen“, um das Secret anzuzeigen. Sie benötigen diese Informationen in Kürze, halten Sie diesen Bildschirm also geöffnet.

Öffnen Sie in einem neuen Tab den Graph API Explorer, das Tool von Facebook zum Testen, was eine App lesen darf. Wenn die App nicht bereits ausgewählt ist, öffnen Sie das Dropdown-Menü „Meta App“ und wählen Sie die gerade erstellte App aus.

Öffnen Sie danach das Dropdown-Menü „Berechtigung hinzufügen“ und wählen Sie alle diese fünf aus: business_management, pages_manage_engagement, pages_read_engagement, pages_read_user_content und pages_show_list.

Sobald alle fünf in der Liste „Berechtigungen“ angezeigt werden, klicken Sie auf „Zugriffstoken generieren“.

Ein Facebook-Anmeldefenster fordert Sie auf, Ihr Konto zu bestätigen. Klicken Sie daher auf „Weiter“.

Facebook fragt Sie dann, auf welche Seiten und Unternehmen Ihre App zugreifen darf. Wählen Sie die Seite aus, die Sie anzeigen möchten, und klicken Sie auf „Weiter“.

Ihr neues Token wird im Feld „Zugriffstoken“ angezeigt. Sie können auf das Kopiersymbol daneben klicken, um den Text zu kopieren.

Da dieses temporäre Token nur etwa eine Stunde gültig ist, fügen Sie es sofort in das Smash Balloon Plugin ein. Gehen Sie zurück zu Ihrem WordPress-Dashboard, navigieren Sie zu Facebook Feed » Alle Feeds und klicken Sie auf „Neu hinzufügen“.

Wählen Sie auf dem nächsten Bildschirm den Feed-Typ „Events“ und klicken Sie auf „Weiter“.

Da Sie noch keine Event-Quelle verbunden haben, ist der Bildschirm „Quelle auswählen“ leer. Klicken Sie daher auf „Neu hinzufügen“.

Fügen Sie Ihre App-ID, Ihr App-Geheimnis und Ihr Benutzerzugriffstoken in die entsprechenden Felder ein und klicken Sie dann auf „Verbinden“.

Nach der Verbindung ruft das Plugin die von Ihnen verwalteten Facebook-Seiten ab und zeigt sie in einer Liste an. Wählen Sie die Seite aus, deren Events Sie präsentieren möchten, und klicken Sie auf „Hinzufügen“.

Ihre Seite wird nun als verbundene Event-Quelle angezeigt. Wählen Sie sie auf dem Bildschirm „Quelle auswählen“ aus und klicken Sie auf „Weiter“, um fortzufahren.

Wählen Sie eine Layout-Vorlage für Ihren Kalender aus und klicken Sie auf „Weiter“.

Wir verwenden für diese Anleitung die Standardvorlage, aber jede Vorlage ist vollständig anpassbar.

Schritt 3: Passen Sie Ihren eingebetteten Facebook-Veranstaltungskalender an

Nachdem Sie Ihren Feed erstellt haben, gelangen Sie zum Smash Balloon Customizer.

Auf der rechten Seite sehen Sie eine Vorschau Ihres Facebook-Eventkalenders, während die linke Seite Einstellungen zur Anpassung der Darstellung Ihrer Events auf Ihrer Website enthält.

Die meisten dieser Einstellungen sind unkompliziert, daher konzentrieren wir uns auf diejenigen, die den größten Einfluss auf Ihren Kalender haben. Zunächst steuert das Bedienfeld „Feed-Layout“ dessen Gesamtform.

Hier können Sie zwischen Listen-, Kachel- und Karussell-Layouts wählen. Kachel zeigt Ihre Events in einem spaltenbasierten Raster an, das sich natürlich an unterschiedliche Kartenhöhen anpasst, während Karussell den Kalender in einen interaktiven Schieberegler umwandelt, durch den Besucher klicken können.

Dasselbe Bedienfeld ermöglicht es Ihnen, die Feed-Höhe anzupassen und die „Anzahl der Beiträge“ festzulegen, mit separaten Steuerelementen für Desktop- und Mobilgeräte. Weniger Beiträge auf Mobilgeräten zu zeigen, verhindert, dass lange Zeitpläne kleine Bildschirme überladen und den Rest Ihrer Inhalte vergraben.

Während Sie Änderungen vornehmen, aktualisiert sich die Vorschau automatisch. Sie können die Geräteschaltflächen in der oberen rechten Ecke verwenden, um zu sehen, wie Ihr Feed auf Desktop-, Tablet- und Mobilgeräten aussieht.

Standardmäßig erbt der Kalender seine Farben von Ihrem WordPress-Theme. Wenn Sie ein anderes Aussehen bevorzugen, können Sie im linken Menü „Farbschema“ auswählen und Ihre Änderungen vornehmen.

Weiter unten verwalten die Header-Einstellungen den Block, der über Ihrem Kalender sitzt und Besucher auf Ihre Facebook-Seite leitet.

Von hier aus können Sie zwischen einem visuellen und einem Text-Header wechseln, den Titel und den Bio-Text anpassen oder den Header über den Aktivierungsschalter vollständig deaktivieren.

Um das Aussehen einzelner Veranstaltungen zu ändern, gehen Sie zu Beiträge » Beitrag-Stil.

Wählen Sie unter Beitragstyp „Boxed“, um jede Veranstaltung in eine eigene, gepolsterte Karte zu setzen, oder wählen Sie „Standard“, um Veranstaltungen durch eine einzelne Trennlinie zu trennen.

Es gibt auch eine Lightbox-Funktion, die ein Popup über der Seite öffnet, wenn jemand auf eine Veranstaltung klickt. So können Besucher Ihren gesamten Zeitplan durchsuchen, ohne Ihre Website zu verlassen.

Diese Bequemlichkeit bedeutet jedoch, dass möglicherweise weniger Leute auf Ihre Facebook-Seite klicken. Wenn Sie Besucher lieber direkt auf Ihre Facebook-Seite leiten möchten, können Sie die Lightbox über den Aktivierungsschalter deaktivieren.

Wenn Sie mit dem Aussehen des Facebook-Veranstaltungskalenders zufrieden sind, vergessen Sie nicht, auf „Speichern“ zu klicken, um Ihre Änderungen zu speichern. Sie können diesen Feed jetzt zu Ihrer WordPress-Website hinzufügen.

Schritt 4: Betten Sie Ihren Facebook-Veranstaltungskalender in WordPress ein

Um den Facebook-Veranstaltungskalender hinzuzufügen, klicken Sie oben auf dem Bildschirm auf die Schaltfläche „Einbetten“.

Zuerst können Sie auf „Zu einer Seite hinzufügen“ klicken.

Wählen Sie die Seite aus, auf der Sie den Veranstaltungskalender veröffentlichen möchten, und klicken Sie auf Hinzufügen.

Sie werden dann zum Block-Editor weitergeleitet.

Klicken Sie hier auf die Schaltfläche „+ Block hinzufügen“ und suchen Sie den Block „Facebook Feed“.

Öffnen Sie danach das Dropdown-Menü im Block-Panel und wählen Sie den zuvor erstellten Veranstaltungsfeed aus.

Der Block wird automatisch aktualisiert, um Ihren Veranstaltungskalender anzuzeigen.

Das Einbetten-Popup enthält auch die Option „Zu einem Widget hinzufügen“, wenn Sie Ihren Kalender lieber in einem Widget-Bereich wie einer Seitenleiste oder einem Footer platzieren möchten. Zusätzlich bietet es einen Shortcode, den Sie überall dort kopieren und einfügen können, wo der Standardblock nicht unterstützt wird.

Nachdem Sie die Seite veröffentlicht haben, öffnen Sie sie in einem Inkognito- oder abgemeldeten Browserfenster, um zu überprüfen, ob Ihre bevorstehenden Facebook-Veranstaltungen angezeigt werden.

Wenn der Kalender geladen wird, aber komplett leer erscheint, überprüfen Sie, ob Ihr Facebook-Konto über Administratorzugriff auf die Seite verfügt, wie in Schritt 2 beschrieben.

FAQs zum Hinzufügen eines Facebook-Veranstaltungskalenders in WordPress

Wie füge ich Facebook-Events zu einem Kalender hinzu?

Sie abonnieren sie, anstatt sie manuell zu kopieren. Suchen Sie auf dem Veranstaltungskalender Ihrer Seite die Schaltfläche „Zum Kalender hinzufügen“. Ein Rechtsklick auf diese Schaltfläche liefert einen Link, den Sie in Google Kalender, Apple Kalender oder Outlook einfügen können.

Beachten Sie, dass das Abonnieren vom Einbetten getrennt ist. Ein Kalenderabonnement synchronisiert Ihre Veranstaltungen in Ihrer persönlichen Kalender-App, während das Einbetten mit einem Plugin wie Smash Balloon den Live-Zeitplan direkt auf Ihrer Website für Besucher anzeigt.

Was ist das beste Event-Kalender-Plugin für WordPress?

Wenn Sie Veranstaltungen direkt auf Ihrer Website hosten möchten, anstatt sie von Facebook zu ziehen, ist Sugar Calendar unsere Top-Wahl. Es verwaltet wiederkehrende Veranstaltungen, nimmt Buchungen entgegen und ermöglicht Ihnen den Verkauf von Tickets über Stripe oder WooCommerce.

Da Sie die Veranstaltungen auf Ihrer Website hosten, funktionieren sie auch dann weiter, wenn Sie die Veröffentlichung auf Facebook einstellen.

Für einen genaueren Blick, sehen Sie sich unsere Sugar Calendar Bewertung an oder vergleichen Sie es mit den Alternativen in unserem Überblick über die besten WordPress Kalender-Plugins.

Wir hoffen, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie einen Facebook-Veranstaltungskalender in WordPress hinzufügen. Möglicherweise möchten Sie auch unsere Expertenauswahl für die besten WordPress Facebook-Plugins sehen oder lernen, wie Sie Ihre Facebook-Timeline in WordPress anzeigen.

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.