Home » WordPress » Wie man den Facebook Messenger-Chat zur WordPress-Website hinzufügt

Wie man den Facebook Messenger-Chat zur WordPress-Website hinzufügt

Wenn Sie vor ein paar Jahren nach Möglichkeiten gesucht haben, eine Live-Chat-Anwendung in Ihre Website zu integrieren, mussten Sie wahrscheinlich ein großes und kompliziertes Plugin oder sogar eine spezielle Anwendung installieren, die Ihnen Kopfschmerzen bereiten würde.

Best WordPress hosting 2024

Jetzt gibt es eine intelligente Alternative zu Live-Chat-Anwendungen – Sie können Facebook Messenger in Ihre WordPress-Website integrieren. Und Sie können das in weniger als 5 Minuten selbst tun!

Es gibt allerdings eine Voraussetzung. Um einen Facebook-Messenger-Chat in Ihre Website einzubinden, müssen Sie eine Art Facebook-Seite haben. Und warum? Weil die häufigste Verwendung eines Chats auf einer Website darin besteht, den Kunden die Kommunikation mit Ihrem Unternehmen zu erleichtern. Sie haben also wahrscheinlich sowieso schon eine Facebook-Seite für Ihr Unternehmen.

Wie man den Messenger-Chat in eine WordPress-Website integriert

Erster Schritt – Bereiten Sie Ihre WordPress-Website vor

Das erste, was Sie brauchen, wenn Sie den Messenger-Chat zu Ihrer Seite hinzufügen wollen, ist, dass Sie zu Darstellung >> Theme-Editor gehen und die Theme-Funktionsdatei – functions.php– öffnen. Hier ist ein Beispiel, was Sie sehen werden (es kann je nach dem von Ihnen verwendeten WordPress-Theme variieren):

How to add Facebook Messenger chat to WordPress website

Scrollen Sie bis zum Ende der Datei und fügen Sie diesen Code am Ende der Datei ein:

function fb_chat_code() {

}
add_action('wp_body_open', 'fb_chat_code');

Klicken Sie dann auf Datei aktualisieren, so dass sie wie folgt aussehen sollte:

how to add facebook chat to wordpress website

Zweiter Schritt – Messenger-Chat-Code in Facebook generieren

Rufen Sie die Facebook-Website auf und öffnen Sie Ihre Facebook-Seite – die Seite, mit der Sie Ihre Website verknüpfen möchten. Wenn Sie als Seitenadministrator festgelegt sind, sehen Sie auf der linken Seite ein Verwaltungsmenü. Klicken Sie auf Einstellungen.

how to integrate facebook messenger to wordpress website

Nächster Schritt: Wählen Sie auf der linken Seite Messaging aus, und scrollen Sie zum Abschnitt Messenger zu Ihrer Website hinzufügen. Klicken Sie auf Erste Schritte.

add messenger in wordpress

Sie sehen nun einen Assistenten, der Sie durch die Messenger-Chat-Einstellungen führt. Sie können die Sprache des Messengers auswählen, die Begrüßungsnachricht ändern und den Gäste-Chat zulassen oder verbieten. Wenn Sie fertig sind, klicken Sie auf Weiter.

messenger live chat in wordpress

Nächster Schritt – Sie können die Standardfarbe des Messenger-Fensters ändern, um sie an das Farbschema Ihrer Website anzupassen. Nehmen Sie bei Bedarf die Änderung vor und klicken Sie auf Weiter.

wordpress facebook messenger

Geben Sie anschließend die URL-Adresse Ihrer Website (einschließlich http…) oben links im Fenster ein. Dies ermöglicht die Verwendung von Messenger nur auf der von Ihnen angegebenen Website, so dass niemand denselben Code kopieren und auf anderen Websites verwenden kann. Klicken Sie auf Speichern.

facebook messenger code for wordpress

Der letzte Schritt – klicken Sie auf das Code-Snippet-Fenster auf der rechten Seite und kopieren Sie den Messenger-Code. Sie müssen ihn zu Ihrer WordPress-Website hinzufügen. Klicken Sie dann auf Fertig stellen.

integrate facebook messenger to wordpress

Dritter und letzter Schritt – Messenger-Chat-Code zu WordPress hinzufügen

Jetzt müssen Sie zu Ihrer WordPress-Website zurückkehren. Klicken Sie auf Erscheinungsbild >> Themen-Editor und öffnen Sie die Datei functions.php erneut. Scrollen Sie bis zum Ende der Datei, wo Sie zuvor eine Funktion hinzugefügt haben, und nehmen Sie diese Änderung vor:

function fb_chat_code() {
    echo " PUT MESSENGER CODE BETWEEN THESE DOUBLEQUOTES ";
}
add_action('wp_body_open', 'fb_chat_code');

Da wir in unserer Funktion doppelte Anführungszeichen verwenden („), und der Messenger-Code ebenfalls doppelte Anführungszeichen verwendet, müssen wir zwischen jedem doppelten Anführungszeichen im Messenger-Code einen umgekehrten Schrägstrich ( ) einfügen (6 Stellen).

Hier sehen Sie, wie der endgültige Code aussehen sollte (alle 6 Backslashes sind im Beispiel grün markiert):

add facebook messenger live chat to wordpress website

Nachdem Sie den Messenger-Code eingefügt und die Backslashes hinzugefügt haben, klicken Sie auf die Schaltfläche Datei aktualisieren:

wordpress messenger chat

Endergebnis

Wenn alle Schritte erfolgreich abgeschlossen wurden, wird der Messenger-Chat auf jeder einzelnen Seite Ihrer WordPress-Website angezeigt. Hier ist das Beispiel, wie es auf dieser Website aussehen würde:

messenger chat in wordpress website
Fathom analytics - privacy focused cookie-free website analytics

Most popular tutorials


Get our latest WordPress news and special offers from RockSolidWP!

Only useful WordPress and WooCommerce tips and tricks and exclusive offers for our readers once a month. No marketing nonsense.

Looking for reliable yet affordable WordPress hosting?
Hostinger is the way to go!

Get 10% OFF by using code IMAKEITWORK