Chat-Plugin

In diesem Dokument erfährst du, wie du das Chat-Plugin programmgesteuert in dein Messenger-Erlebnis auf deiner Website einbindest.

Wenn du das Chat-Plugin mithilfe der Meta Business Suite zu deiner Webseite hinzufügen möchtest (empfohlen), findest du im Meta-Hilfebereich für Unternehmen weitere Informationen.

So funktioniert’s

Wenn du das Facebook-SDK für Javascript in deiner Webseite installierst, wird das Chat-Plugin auf der Webseite angezeigt. Standardmäßig wird der Begrüßungsdialog auf Desktop- und Mobilgeräten angezeigt. Nutzer*innen können auf den Button zum Schließen klicken, um den Dialog zu minimieren. Du kannst die Begrüßung, das Design (z. B. die Farbe) und das Messaging-Erlebnis (z. B. Menüs und Schnellantworten) des Plugins anpassen. Der Status des Dialogs wird zwischengespeichert, maximiert oder minimiert, und zwischen Sitzungen beibehalten.

Logins

Wenn die Person bei Facebook angemeldet ist, zeigt das Plugin die Buttons „Als [NAME] fortfahren“ und „Als Gast fortfahren“ an. Wenn die Person nicht bei Facebook angemeldet ist, zeigt das Plugin die Buttons „Melde dich beim Messenger an“ und „Als Gast fortfahren“ an.

Webhook-Benachrichtigungen

Wenn eine Person auf das Plugin klickt, um einen Chat mit deinem Unternehmen zu beginnen oder fortzusetzen, wird eine Webhook-Benachrichtigung mit folgendem Inhalt an deinen Server gesendet:

• Informationen zur Person, z. B. seitenspezifische IDs (PSID) oder Nutzungs-Referenz-IDs
• Identifizierung der Quelle der Nachricht als Chat-Plugin
• Weiterleitungsinformationen aus der Benachrichtigung

Falls du die Begrüßungsseite in das Plugin integriert hast und die Person auf den Button „Los geht's“ klickt, um eine Unterhaltung mit deinem Unternehmen zu beginnen, wird eine messaging_postbacks-Webhook-Benachrichtigung an deinen Server gesendet. Dein Unternehmen kann dann innerhalb des standardmäßigen 24-Stunden-Messaging-Zeitfensters unter Verwendung der Nutzungs-Referenz-ID Nachrichten an die Person senden.

Bestehende Unterhaltungen

Wenn bereits eine Unterhaltung zwischen der Person und deinem Unternehmen besteht, wird der Chatverlauf automatisch im Plugin geladen. Wenn die Person die Unterhaltung fortsetzt und eine Nachricht sendet, auf einen Button klickt oder eine andere Aktion ausführt, die du in die Unterhaltung integriert hast, wird eine messaging-Webhook-Benachrichtigung an deinen Server gesendet, bzw. eine messaging_referral-Webhook-Benachrichtigung, wenn du Weiterleitungsinformationen einschließt. Dein Unternehmen kann dann innerhalb des standardmäßigen 24-Stunden-Messaging-Zeitfensters unter Verwendung der PSID Nachrichten an die Person senden.

Vom Chat-Plugin unterstützte Nachrichtentypen

Folgendes wird vom Plugin nicht unterstützt:

Bevor du beginnst

Was du benötigst:

• Die Berechtigung pages_messaging.
• Ein Seiten-Zugriffsschlüssel, der von einer Person angefordert wurde, die auf der Facebook-Seite die MODERATE-Aufgabe ausführen kann.
• Eine mit deiner Facebook-Seite verlinkte App, die die Webhooks-Felder messaging, messaging_postbacks und messaging_referrals abonniert hat.
• Die Domain deiner Website wurde mithilfe der Messenger Profile API oder der Meta Business Suite auf die Positivliste gesetzt.

Für deine Nutzung des Chat-Plugins gelten die Nutzungsbedingungen für Meta Business-Tools.

Einschränkungen

• Deine Website muss live sein oder auf der Positivliste stehen, damit das Chat-Plugin erfolgreich implementiert werden kann.
• Wenn für die Facebook-Seite deines Unternehmens Alters- oder Ländereinschränkungen in den Seiteneinstellungen festgelegt sind, wird das Chat-Plugin nicht für Personen angezeigt, die beim Besuch deiner Website nicht bei ihrem Facebook-Konto angemeldet sind.
• Bei den Browsern Safari 12 und höher sowie Firefox wird der Begrüßungsdialog nicht zwischengespeichert.

Hinzufügen des Chat-Plugins

Schritt 1: SDK hinzufügen

Füge das Facebook-SDK für Javascript jeder Seite deiner Website hinzu, auf der das Plugin angezeigt werden soll.

<!-- Messenger Chat Plugin Code --> <div id="fb-root"></div> <div id="fb-customer-chat" class="fb-customerchat"></div> <script> var chatbox = document.getElementById('fb-customer-chat'); chatbox.setAttribute("page_id", "PAGE-ID"); chatbox.setAttribute("attribution", "biz_inbox"); </script> <script> window.fbAsyncInit = function() { FB.init({ xfbml : true, version : 'API-VERSION' }); }; (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = 'https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js'; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script> 

Schritt 2: Plugin anpassen

Verwenden der API

Sende eine POST-Anfrage an den /PAGE-ID/chat_plugin-Endpunkt, um die Begrüßung, die Farbe, das Symbol und mehr für dein Plugin anzupassen.

Beispielanfrage

curl -i -X POST "https://graph.facebook.com/v21.0/PAGE-ID/chat_plugin
    ?welcome_screen_greeting:YOUR-WELCOME-TEXT
    &theme_color:553399
    &entry_point_icon:MESSENGER-ICON
    &entry_point_label:CHAT
    &access_token=PAGE-ACCESS-TOKEN"

In der Referenz zum Chat-Plugin findest du weitere Informationen zu Feldern, mit denen du dein Plugin anpassen kannst.

Verwenden von HTML-Attributen

Wir empfehlen dir, diese Methode nur für Anpassungen zu verwenden, die weder über das Seiteneinstellungstool noch die API möglich sind.

Webhooks-Benachrichtigungen

Wenn eine Person deinem Unternehmen eine Nachricht sendet, wird eine Webhook-Benachrichtigung an deinen Server gesendet.

Bestehende Unterhaltungen

Eine messaging-Webhook-Benachrichtigung wird gesendet, wenn eine Person eine Nachricht zu einer bestehenden Unterhaltung mit deinem Unternehmen sendet. Die Benachrichtigung enthält die seitenspezifische ID der Person. Außerdem ist der Parameter source des Objekts tags auf customer_chat_plugin festgelegt.

Messaging-Benachrichtigung

{
    "object": "page",
    "entry": [
        {
            "id": "PAGE-ID",
            "time": 1559598624359,
            "messaging": [
                {
                    "sender": {
                        "id": "PSID"
                    },
                    "recipient": {
                        "id": "PAGE-ID"
                    },
                    "timestamp": 1559598623749,
                    "message": {
                        "tags": {
                            "source": "customer_chat_plugin"
                        },
                        "mid": "nhEqs_THGoYyAhpK93uNCrIfLZD...",
                        "text": "hello, from customer chat!"
                    }
                }
            ]
        }
    ]
}

Messaging Referrals-Benachrichtigung

Wenn du für dein Chat-Plugin die Eigenschaft ref festlegst, wird eine messaging_referrals-Webhook-Benachrichtigung an deinen Server gesendet.

{
    "object": "page",
    "entry": [
        {
            "id": "PAGE-ID",
            "time": 1559598385735,
            "messaging": [
                {
                    "recipient": {
                        "id": "PAGE-ID"
                    },
                    "timestamp": 1559598385735,
                    "sender": {
                        "user_ref":"USER-REFERENCE-ID"
                    },
                    "referral": {
                        "ref": "REF-PARAMETER-INFORMATION",
                        "source": "CUSTOMER_CHAT_PLUGIN",
                        "type": "OPEN_THREAD",
                        "referer_uri": "REFERRAL-URI"
                    }
                }
            ]
        }
    ]
}

Neue Unterhaltungen

Eine messaging_postbacks-Webhook-Benachrichtigung wird gesendet, wenn eine Person auf der Begrüßungsseite des Plugins auf den Button „Los geht's“ klickt, um eine Unterhaltung zu beginnen.

Messaging Postbacks-Benachrichtigung

{
    "object": "page",
    "entry": [
        {
            "id": "PAGE-ID",
            "time": 1559598624359,
            "messaging": [
                {
                    "sender": {
                        "user_ref": "USER-REFERENCE-ID"
                    },
                    "recipient": {
                        "id": "PAGE-ID"
                    },
                    "timestamp": 1559598623749,
                    "postback":{
                        "title": "TITLE-FOR-THE-CTA",  
                        "payload": "PAYLOAD-DEFINED-BY-CTA",
                        "referral": {
                            "ref": "ADDITIONAL-INFORMATION",
                            "source": "CUSTOMER_CHAT_PLUGIN",
                            "type": "OPEN_THREAD",
                    }
                }
            ]
        }
    ]
}

Anfragen zur Zustimmung zu Marketing-Nachrichten

Weitere Informationen zur Erstellung von Anfragen zur Zustimmung zu Marketing-Nachrichten findest du in unserem Leitfaden zu Marketing-Nachrichten .

Einschränkungen

Bei regelmäßigen Benachrichtigungen für das Chat-Plugin wird nur das Thema Updates und Promotions unterstützt.

Benachrichtigung zu Zustimmungen zu Messaging

Eine messaging_optins-Webhook-Benachrichtigung wird an deinen Server gesendet, wenn eine Person dem Erhalt von Marketing-Nachrichten von deinem Unternehmen zustimmt.

"object": "page",
    "entry": [
        {
            "id": "PAGE-ID",
            "time": TIMESTAMP,
            "messaging": [
                {
                    "recipient": {
                        "id": "PAGE-ID"
                    },
                    "timestamp": TIMESTAMP,
                    "optin": {
                        "type": "notification_messages",
                        "payload": "empty_payload",
                        "notification_messages_token": "NOTIFICATION-MESSAGE-TOKEN",
                        "notification_messages_frequency": "MESSAGE-FREQUENCY",
                        "topic": "NOTIFICATION-MESSAGE-TOPIC",
                        "token_expiry_timestamp": EXPIRATION-DATE-TIMESTAMP,
                        "ref": "ADDITIONAL-INFORMATION",
                        "user_token_status": "NOT_REFRESHED",
                        "notification_messages_status": "RESUME_NOTIFICATIONS"
                    }
                }
            ]
        }
    ]
}

Du kannst für den Wert notification_messages_token den ID-Wert im recipient-Objekt nehmen, um Marketing-Nachrichten an eine Person zu senden.

Tipps zur Fehlerbehebung

• Wird nicht angezeigt …

  • Stelle sicher, dass deine Domain auf die Positivliste gesetzt wurde
  • Stelle sicher, dass der Referrer-Policy-Header festgelegt ist, sodass die Referrer-URL gesendet wird

• Chat-Plugin wird in Firefox nicht angezeigt

  • Entferne das Firefox Facebook Container-Add-on.
  • Deaktiviere die Blockierung von Inhalten (klicke auf das graue Schild in der Suchleiste), um das Plugin anzeigen zu lassen.

Nächste Schritte

• Eine Antwort senden
• Marketing-Nachrichten senden

Siehe auch

• Beständiges Menü deaktivieren
• Facebook-SDK für JavaScript
• Gastmodus – Ermöglicht Nutzer*innen, Unterhaltungen zu starten, ohne bei Facebook angemeldet zu sein.
• Eisbrecher – Ermöglicht Nutzern, eine Unterhaltung mit einem Unternehmen mit einer Liste von häufig gestellten Fragen zu starten.
• Beständiges Menü – Hilft Personen, deine angebotenen Funktionen während der Unterhaltung zu entdecken und einfacher auf sie zuzugreifen.