So fügen Sie Ihrer Website einen Facebook-Kundenchat hinzu: Social Media Examiner
Facebook Tools Facebook Chat Facebook / / September 26, 2020
Möchten Sie besser mit Interessenten und Kunden in Kontakt treten?
Wussten Sie, dass Facebook Messenger das Einbetten eines Live-Kundenchat-Widgets in Ihre Website vereinfacht?
Mit dem Messenger-Kundenchat-Plugin können Sie ein Live-Gespräch mit Website-Besuchern führen.
In diesem Artikel werden Sie Erfahren Sie, wie Sie Ihrer Website ein Facebook Messenger-Kundenchat-Widget hinzufügen.
![So fügen Sie Ihrer Website einen Facebook-Kundenchat von Dana Tran auf Social Media Examiner hinzu.](/f/7040b1e94803c26ebfd032c419da6429.png)
Warum sollten Sie den Kundenchat von Messenger auf Ihrer Website verwenden?
Ein Kunden-Live-Chat ist ein kleines schwebendes Symbol, das normalerweise in der unteren rechten Ecke einer Website angezeigt wird. Wie bei einer herkömmlichen Live-Chat-Software können Sie eine installieren Messenger-Kunden-Chat-Plugin Auf deiner Webseite.
Dieses Plugin erleichtert es Website-Besuchern mit einem Messenger-Konto, ein Live-Gespräch mit einem Menschen zu führen, eine Nachricht zu hinterlassen und mit Ihrem zu interagieren Messenger Bot.
![Beispiel für ein Messenger-Kunden-Chat-Plugin](/f/33bafd3e0133c21b694274ef9ecde51c.png)
Facebook berechnet Ihnen keine Gebühren für die Installation dieses Kunden-Chat-Widgets. Sie benötigen nicht einmal einen Messenger-Bot. Die einzige Voraussetzung ist eine Facebook-Seite.
Bevor wir uns mit dem Einrichten einer Messenger-Live-Chat-Funktion mithilfe von ManyChat und Chatfuel befassen, wollen wir uns einige Gründe ansehen, warum Sie einen Live-Chat auf Ihrer Website haben sollten.
Verwalten von Gesprächen über den Posteingang Ihrer Seite
Alle Nachrichten, die über das Messenger-Chat-Widget auf Ihrer Website gesendet werden, werden automatisch im Posteingang Ihrer Facebook-Seite angezeigt.
![Facebook-Seite Posteingang Messenger](/f/6b934c8f0bc52f2cd2e0464e91ee692c.png)
Sie können die Nachrichten der Besucher auch auf Ihrem Mobilgerät über die kostenlose Facebook Page Manager-App lesen und beantworten, die auf der Website verfügbar ist Appstore und Google Play.
Verbessern Sie den Kundenservice
Laut Facebook 53% der Menschen sind eher bereit, mit einem Unternehmen einzukaufen, das sie direkt benachrichtigen können. Mit Ihrem herkömmlichen Live-Chat können Sie die Chat-Konversation nur auf einer bestimmten Site durchführen. Mit dem Messenger-Chat können Sie jedoch eine Konversation auf dem Desktop starten und sie dann zu einem späteren Zeitpunkt auf Ihrem Mobilgerät mit Messenger fortsetzen.
Sofortige automatisierte Antworten bereitstellen
Mit dem Messenger-Chat-Widget können Besucher Fragen direkt auf Ihrer Website stellen Führen Sie Gespräche mit potenziellen Leads in Echtzeit.
![Facebook Messenger Chat-Konversation](/f/bacf35a94318dff7d7bde60b4a2406b2.png)
Wenn Sie kein Support-Team haben, das rund um die Uhr arbeitet, um Kundenfragen zu beantworten, Erstellen Sie einen Messenger-Bot, um Ihr Messenger-Chat-Widget mit Strom zu versorgen und grundlegende FAQs zu beantworten.
Um Besucher in Leads umzuwandeln, können Sie den Nutzern die Möglichkeit dazu geben Abonnieren Sie Ihren Messenger oder E-Mail-Newsletter, Bleimagnete liefern, oder Stellen Sie Links zu zusätzlichen nützlichen Inhalten bereit während sie auf eine menschliche Antwort warten.
![Messenger Kunden Chat Plugin Mari Smith](/f/2eba441b390f610b9b790cf7cb4efa8a.png)
Schauen wir uns nun an, wie Sie eine Chat-Funktion für Messenger-Kunden mit Chatfuel und ManyChat einrichten.
# 1: Richten Sie den Messenger-Chat auf Ihrer Website mit Chatfuel ein
Auch wenn dies nicht erforderlich ist, ist es effektiver, wenn ein Messenger-Bot Benutzern eine Begrüßung sendet, wenn sie einen Live-Chat über das Messenger-Kunden-Chat-Plugin starten.
Beginnen wir also damit, diese Begrüßungsnachricht in zu erstellen Chatfuel. Wenn Sie dieses Tool noch nicht verwendet haben, lesen Sie in diesem Video nach, wie Sie sich anmelden und Erstelle einen einfachen Bot mit Chatfuel.
Nachdem Sie sich angemeldet haben, Klicken Sie auf die Registerkarte Automatisieren. Dann Klicken Sie auf das + Zeichen um einen neuen Block zu erstellen.
![ChatFuel neuen Block erstellen](/f/412883ecfabe2c04fa43015a2b65a511.png)
Um die Dinge organisiert zu halten, Klicken Sie auf den Titel des Blocks und Benennen Sie es in "Live Chat" um. Klicken Sie unter Karte hinzufügen auf Klicken Sie auf das + Zeichen.
![ChatFuel Änderungsblockname](/f/43ae55392c27e66b5c90202c9fbc836f.png)
Im Popup-Fenster Klicken Sie auf Live Chat um das Live-Chat-Plugin hinzuzufügen.
![ChatFuel Plugins](/f/cafd41267827049e5084e1efda1277ea.png)
Dieses Plugin deaktiviert vorübergehend die Funktion für künstliche Intelligenz Ihres Bots, wenn Sie ein Live-Gespräch mit einem Benutzer führen. Immer wenn es eine neue Chat-Sitzung gibt, erhalten Sie von Ihrem Messenger-Bot eine Push-Benachrichtigung.
Jetzt Ändern Sie die Standardstartmeldung ("Sie haben eine Chat-Sitzung mit unserem Operator gestartet"). Geben Sie etwas wie "Willkommen {{Vorname}}" ein! Womit kann ich Ihnen behilflich sein?" Das Hinzufügen von geschweiften Klammern nach "Vorname" weist den Bot an, den Vornamen des Benutzers in Ihre Begrüßungsnachricht aufzunehmen. Facebook stellt diese Informationen automatisch zur Verfügung, sodass Sie den Benutzer nicht auffordern müssen, ein Formular auszufüllen oder dieses grundlegende Detail auszufüllen.
![ChatFuel passen die Begrüßungsnachricht an](/f/60524094ff81ec88dc8eb3b107f18ced.png)
Du kannst auch Überprüfen und ändern Sie die Beschreibung der Startnachricht und die Stoppnachricht. In diesem Tutorial werden nur die Standardeinstellungen verwendet.
Jetzt Klicken Sie auf das Link-Symbol oben auf der Seite neben dem Namen des Blocks.
![ChatFuel Link-Symbol](/f/59d0d8e95e1b7c3907de1792860d59a8.png)
In dem angezeigten Fenster Schalten Sie die Option Block Link ein. Dann Geben Sie einen Referenzlink ein und denken Sie daran, was Sie eingegeben haben. Dann Klicken Sie auf die orangefarbene Schaltfläche Fertig.
![ChatFuel Block Link Option](/f/fe34fa11ce6ddc38a4a16afe31efbbd4.png)
Nachdem Sie die Begrüßungsnachricht erstellt haben, ist der nächste Schritt: Generieren Sie den Codefür das Messenger Chat Plugin.
Klicken Sie auf die Registerkarte Wachsen in der linken Seitenleiste. Auf der Seite Wachstumstools Finden Sie das Kunden-Chat-Plugin für Ihre Website und Klicken Sie auf Aktivieren darunter.
![ChatFuel aktiviert das Kunden-Chat-Plugin](/f/c0e98e35f2ef82d0ef62215be4ce8bea.png)
Im Popup-Fenster Geben Sie die URL für die Website ein wo Sie dieses Messenger-Chat-Plugin installieren möchten. Dann Geben Sie den Parameter ref ein Sie haben oben hinzugefügt. Wenn ein Benutzer einen Live-Chat mit Ihrem Messenger-Chat-Plugin startet, sendet Ihr Bot den Benutzern diesen Nachrichtenblock mit dem Live-Chat-Plugin.
![ChatFuel Konfigurieren Sie das Kunden-Chat-Plugin](/f/d179a7ea53f8737261bcfec681704f0e.png)
Der Code für dieses Chat-Plugin wird also automatisch für Sie generiert Klicken Sie auf Kopieren, um es in Ihre Zwischenablage zu kopieren. Anschließend fügen Sie diesen Code in den Header-Bereich Ihrer WordPress-Site ein. Einzelheiten finden Sie in Abschnitt 3 unten.
Advanced Hack: Passen Sie Ihr Messenger-Chat-Widget an
Wussten Sie, dass Sie diesem Code einige Zeilen hinzufügen können, um Ihr Messenger-Chat-Widget weiter zu verbessern? So sieht das soeben erstellte Plugin aus:
![Beispiel für ein Chat-Plugin für ChatFuel Messenger](/f/9141d263e7a5fcf3907bbf5fd3eab29e.png)
Durch Hinzufügen von Code können Sie das Chat-Plugin anpassen an:
- Ändern Sie die Themenfarbe passend zu Ihrer Marke.
- Zeigen Sie eine andere Begrüßung für Personen an, die bei Facebook angemeldet sind vs. diejenigen, die nicht bei Facebook angemeldet sind.
Um diese Änderungen vorzunehmen, Fügen Sie den aus Chatfuel generierten Code in einen Notizblock oder einen Texteditor ein. Suchen Sie unten nach dem Codeausschnitt in Gelb.
![ChatFuel Messenger Chat Plugin Code](/f/b2f589a775d807775823b11a5bb622a0.png)
Innerhalb dieses Schnipsels Fügen Sie die drei fettgedruckten Linien unten hinzu:
![ChatFuel Messenger Chat Plugin Code](/f/88c59d492f2b9014e4c5d6d687d6ecdc.png)
Ersetzen Sie #FFFFFF durch den Hex-Code der Farbe, die Sie verwenden möchten für das Thema. (Sie können Hex-Farbcodes mit einem Werkzeug wie finden ColorHexa.) Ersetzen Sie "Begrüßungsnachricht", um die beiden Begrüßungen zu ändern.
Angenommen, Sie möchten das standardmäßige blaue Facebook-Farbthema in Grün ändern und die Standard-Begrüßungsnachricht von „Hi! Wie können wir Ihnen helfen?" zu einem Aufruf zum Handeln für Ihr Unternehmen. Hier ist der Code, den Sie Ihrem Chat hinzufügen können:
![ChatFuel Messenger Chat Plugin Code](/f/5cc5514b766b519c97121d9cef76fca1.png)
Das Chat-Widget würde nun folgendermaßen aussehen:
![ChatFuel Messenger Chat Plugin anpassen](/f/ccd18a6e5b18be6c5cfca37c9ad6072d.png)
# 2: Richten Sie den Messenger-Chat auf Ihrer Website mit ManyChat ein
So richten Sie eine Messenger-Live-Chat-Funktion mit ein ManyChat, Anmeldung und Klicken Sie auf die Registerkarte Wachstumstools in der linken Seitenleiste. Wenn Sie dieses Tool noch nicht verwendet haben, lesen Sie in diesem Video nach, wie Sie sich anmelden und Erstellen Sie mit ManyChat einen einfachen Bot.
![Registerkarte ManyChat Growth Tools](/f/0536351cc46616f3af39687b50696548.png)
Nächster, Klicken Sie auf die Schaltfläche Neues Wachstumstool oben auf der Seite.
Holen Sie sich YouTube Marketing Training - Online!
![](/f/f87795383bdc9cd402eae42f8074d1ba.png)
Möchten Sie Ihr Engagement und Ihren Umsatz mit YouTube verbessern? Nehmen Sie dann an der größten und besten Versammlung von YouTube-Marketingexperten teil, die ihre bewährten Strategien teilen. Sie erhalten eine schrittweise Live-Anleitung, auf die Sie sich konzentrieren können YouTube-Strategie, Videoerstellung und YouTube-Anzeigen. Werden Sie zum YouTube-Marketing-Helden für Ihr Unternehmen und Ihre Kunden, während Sie Strategien implementieren, die nachgewiesene Ergebnisse erzielen. Dies ist eine Live-Online-Schulungsveranstaltung Ihrer Freunde bei Social Media Examiner.
KLICKEN SIE HIER FÜR DETAILS - VERKAUF ENDET AM 22. SEPTEMBER!![Schaltfläche "ManyChat New Growth Tool"](/f/fcb6030c27388fdcfadf2870857ac4c1.png)
In dem Fenster, das herausgleitet, Klicken Sie auf Kundenchat.
![Wachstumstool für ManyChat-Kundenchat](/f/2c3d4e684bab58b6a95a285b69c0b517.png)
Um die Dinge organisiert zu halten, Benennen Sie dieses Wachstumstool in "Live Chat" um. und dann Klicken Sie auf die blaue Schaltfläche Speichern.
![ManyChat benennt Wachstumstool um](/f/fd6fb8893aa774183a926aa70176ddd2.png)
Nächster, Klicken Sie auf Bearbeiten um die Anmeldemeldung zu bearbeiten. Dies ist die Nachricht, die Benutzer erhalten, wenn sie auf das Chat-Widget klicken, um eine neue Chat-Konversation zu starten.
![ManyChat bearbeitet die Anmeldemeldung](/f/81cff42d6654e5e7bcd5df13c7bb959b.png)
Ändern Sie den Text der Anmeldemeldung zu so etwas wie „Hi! Vielen Dank für Ihren Besuch. Hattest du eine Frage? "
![ManyChat bearbeitet die Anmeldemeldung](/f/b423f4b163a602523309025eefb5b6a0.png)
Klicken Sie auf Veröffentlichen oben auf der Seite und dann Klicken Sie auf Live Chat zurück zum Wachstumstool.
![Schaltfläche "ManyChat Publish"](/f/27ff1c2bcf2e12772db7c5a1b0901e9f.png)
Jetzt Klicken Sie auf die blaue Schaltfläche Weiter und Entscheiden Sie, wo das Chat-Widget angezeigt werden soll. Lassen Sie diese Felder leer, wenn das Chat-Widget auf jeder Seite Ihrer Website angezeigt werden soll.
![ManyChat-Sichtbarkeitseinstellungen](/f/8419d9b11ad802ae6078c8d2572c8135.png)
Wenn du möchtest Ändern Sie die Farbe des Widgets, Geben Sie einen Hex-Code ein oder wählen Sie eine Farbe aus der Palette. Beachten Sie, wie sich das Chat-Widget und die Farbe der Nachrichtenblase des Benutzers in der Vorschau rechts ändern.
![ManyChat wählen Farbe](/f/1aec1162530676e50ded0a2b9c861400.png)
Mit ManyChat können Sie auch Ändern Sie die Begrüßungsnachricht für Benutzer, die bei Facebook angemeldet sind, und für Benutzer, die bei Facebook abgemeldet sind.
![ManyChat-Begrüßung für angemeldete Benutzer](/f/3d8453b1ff8bf45fbd75d8a2d05d4e84.png)
Nächster, Wählen Sie aus, ob das Chat-Widget auf Mobilgeräten und / oder auf dem Desktop angezeigt werden soll. Ebenfalls, Wählen Sie aus, wie sich das Kunden-Chat-Widget verhalten soll, wenn eine Person es zum ersten Mal sieht Auf deiner Webseite.
![ManyChat Show auf diesen Geräten](/f/7a4e7609481e6b162064d034fa11b721.png)
Nachdem Sie die Änderungen konfiguriert haben, Schalten Sie Ihr Widget von Entwurf auf Aktiv um in der oberen rechten Ecke der Seite.
![ManyChat aktiviert das Widget](/f/1ec7053a26923e85434b43df774f9a34.png)
So installieren Sie das Messenger-Chat-Widget auf Ihrer Website: Klicken Sie auf das blaue JavaScript-Snippet installieren Taste.
![Schaltfläche "JavaScript-Snippet installieren" von ManyChat](/f/b45a6141f580565617485f76e1f07506.png)
Geben Sie die Website-URL ein wo Sie dieses Chat-Plugin installieren und Klicken Sie auf Hinzufügen. Dann Weiter klicken.
![ManyChat Authorize Website](/f/43c439119254f6a0d30f8069b148f90d.png)
ManyChat generiert automatisch den Code, den Sie zum Einfügen in Ihre Website benötigen. Klicken Sie auf Code in Zwischenablage kopieren.
![ManyChat kopiert Code in die Zwischenablage](/f/c0ac1e0be4710bca0042d1b504a60de2.png)
# 3: Installieren Sie den Code auf Ihrer WordPress-Site
Nachdem Sie eine Messenger-Chat-Funktion mit Chatfuel oder ManyChat eingerichtet haben, müssen Sie den Code als letztes auf Ihrer Website installieren. Wenn Sie WordPress verwenden, Navigieren Sie zu Ihrem Dashboard und Klicken Sie auf Plugins im linken Menü.
![WordPress Insert Heads und Footers Plugin](/f/d0a2f2674cb1ee58f16045681858d54a.png)
Dann Klicken Sie auf die Schaltfläche Neu hinzufügen oben auf der Seite.
![WordPress Insert Heads und Footers Plugin](/f/6df1eaf6cadc613594bd8abd7c6b1e71.png)
Im Suchfeld Suche nach dem freien Plugin für Kopf- und Fußzeilen einfügen.
![WordPress Insert Heads und Footers Plugin](/f/84b72e190bb9d67560b454f87230ce30.png)
Klicken Sie auf die Schaltfläche zu Installieren Sie das Plugin und klicken Sie dann erneut auf aktiviere das Plugin.
![WordPress Insert Heads und Footers Plugin](/f/eb6a3439a92a8039e55af70b950ee72f.png)
Von der linken Seitenleiste aus Klicken Sie auf Einstellungen und Wählen Sie Kopf- und Fußzeilen einfügen.
![WordPress Insert Heads und Footers Plugin](/f/fd92a12536f13abe09f0de293a57d50b.png)
Schließlich, Fügen Sie den Messenger-Chat-Code in Ihren Skript-Header ein und Klicken Sie auf Speichern.
![WordPress Insert Heads und Footers Plugin](/f/2fb4e26e6b236c71854c085c9d0cc596.png)
Wenn du Lade die Seite neuJetzt sollte das Messenger-Chat-Plugin auf Ihrer Website angezeigt werden.
Trinkgeld: Wenn Sie Leadpages verwenden, führen Sie die folgenden Schritte aus, um das Widget einzubetten:
- Fügen Sie die Leadpages-URL zur Liste der autorisierten Websites (ManyChat) oder Website-Domains (Chatfuel) hinzu.
- Fügen Sie dann den HTML-Code in das Feld für den Tracking-Code des Kopfabschnitts in Leadpages ein.
![LeadPages Head Section Tracking Code](/f/b5805769cd06013d53337a1295a282cf.png)
Andere hilfreiche Ressourcen
Chatfuel Kundenchat
Wenn Sie einen Messenger-Bot mit Chatfuel erstellen, können Sie dies auch schnell tun Installierendas Chat-Widget auf Ihrer WordPress-Sitemit Hilfe des Chatfuel Customer Chat Plugins.
![Installieren Sie das Facebook Customer Chat WordPress Plugin.](/f/ad52d672821263a8ba1092b08b64dd55.png)
Chatfuel und Master of Code (ein Technologieunternehmen, das Messenger-Chatbots für Unternehmen wie die World Surfing League, die Online News Association und andere globale Marken erstellt hat) hat dieses Plugin entwickelt. Sie können dieses kostenlose Plugin herunterladen und die Installationsanweisungen dazu finden WordPress-Seite.
Messenger-Posteingang
Zu Antwort an Benutzer Wer Ihr Unternehmen angeschrieben hat, können Sie entweder Verwenden Sie den Posteingang-Link auf Ihrer Facebook-Seite oder Laden Sie den Beamten herunter Facebook Pages Manager App auf iOS oder Android.
![Verwenden Sie die Registerkarte Posteingang auf Ihrer Facebook-Seite, um auf Nachrichten zu antworten.](/f/2aac8a501255dc9cfc92605addd27a58.png)
Wenn Sie ManyChat verwenden, können Sie dies auch tun Antworten Sie den Benutzern über die Registerkarte Live-Chat. ManyChat hat keine App, aber ihre Live-Chat-Seite sieht auf einem mobilen Gerät großartig aus.
![Antworten Sie Benutzern über die Registerkarte Live-Chat in ManyChat.](/f/b5f1ef3a5f11c4ae6f84a129642a9e04.png)
Dokumentation zum Kunden-Chat-Plugin
Weitere Informationen zum Anpassen des Kunden-Chat-Plugins (wenn Sie ein wenig technisch versierter sind) finden Sie unter offizielle Facebook-Dokumentation für Details.
Fazit
Indem Sie Ihren Website-Besuchern eine bequeme Möglichkeit bieten, über das Messenger-Live-Chat-Plugin mit Ihrem Unternehmen zu kommunizieren, können Sie:
- Beheben Sie schnell alle Bedenken bezüglich Ihres Produkts oder Ihrer Dienstleistung.
- Beantworten Sie Fragen von potenziellen Käufern und Kunden.
- Stellen Sie den Besuchern relevantere und hilfreichere Informationen zur Verfügung.
Sie tun dies auch in Messenger, einer kostenlosen Plattform, die derzeit von über 1,3 Milliarden Menschen genutzt wird. Jeden Monat werden über 2 Milliarden Nachrichten zwischen Menschen und Unternehmen gesendet.
Was denken Sie? Hast du einen Messenger Bot? Denken Sie darüber nach, das Messenger Live Chat Plugin auf Ihrer Website zu installieren? Bitte teilen Sie Ihre Gedanken in den Kommentaren unten.