Facebook Messenger Integration Guide

Bright Pattern Documentation

Generated: 5/14/2021 1:53 pm
Content is available under license unless otherwise noted.

About

The Bright Pattern Contact Center Facebook Messenger Integration Guide provides instructions for setting up your Bright Pattern Contact Center to function in an integrated manner with your organization’s Facebook page.

The Faster Way to Connect to Customers

When integrated with the Facebook Messenger mobile messenger application, Bright Pattern Contact Center omnichannel cloud call center software enables agents of your contact center to connect with customers via interactive SMS-style text messages, photos, videos, audio files, links, location sharing, and more.

Bright Pattern’s omnichannel system routes Facebook Messenger chat interactions to agents who are logged in to the Agent Desktop application. Agents can respond in context to any customer inquiry, recognize customers, record and distribute the interactions to supervisors, capture customer satisfaction with post-transactional surveys, and assess performance through an extensive set of reports.

Reduce Agent Load with Automation

System administrators can tailor their Facebook Messenger experience and automate aspects of their organization’s business processes. Such customization is achieved using Bright Pattern’s omnichannel Scenario Builder application.

Scenario Builder automates frequent requests into self-service using Interactive Voice Response (IVR) technology. With chat scenarios, customers are prompted to provide information such as name, email, and their question, and their information is directed to the appropriate agent or service queue. Administrators can use call scenarios to design custom forms, auto-generated messages, and surveys for any service.

Scenarios and IVR technology provide the following features:

Agent Desktop Integration

Seamless integration with Facebook Messenger provides constant contact with customers using their app of choice. Agents at your contact center work within Bright Pattern's efficient, integrated Agent Desktop user interface, utilizing the same contacts and tools with which they are familiar.

Agent Desktop integration offers the following features:

Improve Customer Experience

Facebook Messenger customer data is pushed to the integrated Agent Desktop, enabling customers to be identified automatically according to their Facebook profile. Moreover, customers keep their place in queue, ensuring that priority customers are identified as such and are served faster.

Built-in screen recording, monitoring, and grading quality management tools ensure maximum service quality. For example, a customer does not have to repeat information on transfer because the information follows the interaction through transfers and is saved to the activity history. To ensure the best service quality possible, agents and supervisors can routinely assess customer satisfaction by using built-in post-transactional surveys attached to both service and agent performance reports.



Audience

The Facebook Messenger Integration Guide is intended for the IT and/or technical personnel responsible for the data infrastructure of the contact centers that use Bright Pattern Contact Center solutions for customer interaction processing. Readers of this guide are expected to have experience in administration of these systems, as well as a solid understanding of contact center operations and resources that are involved in such operations.




Prerequisites

Facebook Messenger integration requires that you have admin-level access to both Bright Pattern Contact Center and your organization’s Facebook App and Facebook Page.

Software Versions

For all types of integration described in this guide, the following is required:



Facebook Messenger Integration Configuration

When Bright Pattern Contact Center is integrated with Facebook Messenger, your Bright Pattern Agent Desktop environment is equipped to handle customer-initiated interactions from the Messenger application or the Facebook application on a customer’s mobile phone, tablet, or computer. Incoming chat interactions are routed to the integrated Agent Desktop environment, where agents also have direct access to the phone, live chat, email, SMS, various other mobile messenger apps, customer and agent records, interaction details, and more.

Integration configuration involves linking your Facebook Page to your Bright Pattern Contact Center.

To configure Facebook Messenger integration, you will need system access to:

The Facebook App contains the settings for your webhook and access token. Your Facebook Page is what is used as your organization’s identity. Messaging events for your Facebook Page are sent securely to your webhook. Contact Center Administrator is where you add the Messenger integration account to Bright Pattern Contact Center.

Configuration Procedure

Step 1: Create a Facebook App and a Facebook Page

Go to developers.facebook.com, and create a Facebook App and a Facebook Page for your organization. If you have already done this, skip this step and proceed to Step 2.

Note that for your Facebook Page, you will additionally need to create a username for it. The Page username is what appears in your Facebook Page’s URL, beneath the Facebook Page’s name on the page itself, and in search results. You will need your Page username later in this configuration procedure. See Facebook’s Help Center for more information on how to create one.

Step 2: Manage your Facebook App

After registering as a developer and creating both your Facebook App and Page, log in to your Facebook app management page at developers.facebook.com. On the dashboard, you should see your App ID.

Step 3: Add Messenger as a product

Adding Messenger as a product to your Facebook App allows your Facebook Page to use the Messenger API to handle chat interactions.

  1. From the left-hand menu, next to Product, click + to add a new product.

  2. Select the product called Messenger.

  3. Once it has been added, you will see Messenger on the left-hand menu.

  4. Under Messenger, click Settings.


Step 4: Update token settings

The Messenger Platform’s Settings displays sections called Access Tokens, Webhooks, and Pages, among others.

  1. In the Access Tokens section, next to the desired Facebook Page, click Generate Token. This will generate the Page Access Token.

  2. If you did not already create a Facebook Page, click the Create New Page link.

  3. Note that you must also set permissions for which pages the admin user can access.

  4. In the Token Generated dialog, click I Understand and then copy the token. You will need this when configuring your integration account in later steps.


Token Generation


Step 5: Create a new integration account in Contact Center Administrator

Now, in a new browser tab, configure the integration account that will link Facebook Messenger to Bright Pattern Contact Center. Keep this tab open so it is easy to switch between sites and copy and paste credentials.

  1. Log in as Admin to the Contact Center Administrator application.

  2. Navigate to Configuration > Integration Accounts.

  3. Click the Add "+" button to add a new account.

  4. In the Create integration account window that appears, select Messenger and click OK.

  5. In Type, select Facebook.


Step 6: Specify Facebook Messenger integration account properties

Using the credentials for your Facebook App, enter values for the following screen properties. (If you do not know your credentials, ask your system administrator.)


Click Apply to save your changes.


Facebook Messenger integration account properties


Step 7: Edit your page subscription settings

Now that your integration account is set up, go back to your Facebook Developers page and continue working on configuration there.

  1. In the Webhooks section, click Edit Callback URL to update the Callback URL and Verify Token fields.

    Edit Callback URL


  2. Enter a Callback URL for a webhook. The URL should be of the form https://<tenant_url>/clientweb/fb/webhook, where <tenant_url> should be changed to the domain of your Bright Pattern Contact Center client web server.[1]

    For example: https://example-company.brightpattern.com/clientweb/fb/webhook

  3. In Verify Token, set the Webhook Verify Token you generated in your integration account properties in Step 6 of this procedure.

  4. Then click Verify and Save. This allows Facebook to send an HTTP request to the callback URL to verify that it is legitimate.

  5. Edit webhooks options by clicking Edit.

    Edit webhook options


  6. In Edit Page Subscriptions, select subscription fields to subscribe to webhook events. The following are the minimum set of subscription fields needed: messages, message_deliveries, and message_reads.

    Select these subscription fields at minimum


  7. When done, click Save.


See facebook.com for more information about the Messenger Platform.

Step 8: Add "Send Message" button to your Facebook Page

Now that your integration is set up, you need to add the "Send Message" button to your Facebook Page and point it to the Messenger platform.




  1. Starting with Bright Pattern Contact Center version 5.3, we no longer require the Page ID to be included in the Callback URL. The Page ID is taken from the event body. Therefore, one Facebook app can work with multiple Facebook Pages, and multiple integrations can be added per each such page in Bright Pattern configuration, sharing the same webhook.


Customizing Interactions Using Scenarios

You can determine how Bright Pattern Contact Center handles chat interactions and customer data directly from Bright Pattern scenarios.

For every customer interaction that enters your contact center, Bright Pattern Contact Center has to process that specific interaction to determine what to do with it (e.g., what prompts or announcements to apply, what resources to queue for, what music to play, or when to overflow to alternate resources). The logic of such automated interaction processing is defined in scenarios. Execution of a scenario with respect to a specific interaction is triggered by a particular event, such as the initiation of a chat session from a specific web page or app.

Scenarios are designed and edited in the application called Scenario Builder. This application is launched from the Contact Center Administrator application when you add a new scenario or select an existing one for editing. For more information, see the Contact Center Administrator Guide, section Scenarios Overview.

Note that your contact center (i.e., tenant) can have multiple Facebook Messenger integration accounts if it has multiple scenario entries. Each scenario entry can have only one Facebook page (one maximum for each messenger type). Each service can have one Facebook page as an outbound chat account. The same Facebook page can be assigned to one scenario entry/service only.




Scenario Configuration

The following steps will walk you through the process of creating a scenario.

Step 1: Create a web chat scenario.

  1. In the Contact Center Administrator application, navigate to Configuration > Scenarios > Chat.
  2. At the bottom of the screen, click the + button to add a new chat scenario. Alternatively, you may select and edit the web chat scenario template called Mobile Chat.

Step 2: Specify screen properties for the scenario.

  1. Screen properties for the scenario are displayed on the right side of the screen. Specify all values as you would for any other chat scenario. For more information on such screen properties, see the Contact Center Administrator Guide, section Chat.
  2. Pay particular attention to the field called Messenger Accounts. In this field, select the name of your Facebook Page or add a new one by clicking the add/edit link.


Chat scenario for a messenger integration account


Step 3: Customize your scenario in Scenario Builder.

  1. Open your new scenario by double-clicking its name in the Chat list on the left. The scenario will open in the Scenario Builder application.
  2. Before you do anything else, save your scenario by clicking the Save As button and giving this scenario a unique name, such as "Messenger Chat," to differentiate the new scenario from the scenario template.




Scenario Blocks

Actions or prompts called blocks are organized in each scenario, forming the order of operations for a specific service. For Facebook Messenger integration, this service is a chat service, and the scenario tells the Bright Pattern system how to route messages from customer to agent, what information to collect from the customer, what automatic messages to present to the customer, and what conditional exits to take in a variety of situations.

In the example shown, the web chat scenario template called Mobile Chat has been opened for editing and renamed messenger chat. You should use this scenario as a base for yours, customizing the screen properties of each block to suit your chat service. For more information on these blocks, refer to the Bright Pattern Contact Center Scenario Builder Reference Guide.

To access Facebook data from a scenario, the following scenario blocks should be present in your scenario, in this order. If they are not, drag them onto the center pane of Scenario Builder.

  1. Send Message
  2. Send Message
  3. If
  4. Find Agent
  5. Send Message
  6. Connect Chat
  7. Send Message
  8. Exit


Messenger chat scenario example


Send Message

The Send Message block is used to send a text message to a chat/mobile/messenger customer via SMS. More information about Send Message settings is available in the Scenario Builder Reference Guide, section Send Message.

If

The If block allows branching of a scenario based on verification of some specified conditions. Multiple conditional exits (branches) can be configured in the same block.

For examples of how this block is used, see the Scenario Builder Reference Guide, section If.

Find Agent

The Find Agent scenario block finds an agent qualified to handle a given interaction. When the agent becomes available, the block creates a variable called $(destination) and sets it to the agent’s phone number (for voice) or username (for chat).

For descriptions of this block’s screen properties, see the Scenario Builder Reference Guide, section Find Agent.

Connect Chat

The Connect Chat scenario block connects a chat to the destination specified in the $(destination) variable (typically, the agent found by the preceding Find Agent block or to the specified chat scenario entry). If the agent is logged in, the system tracks the agent’s state according to the state of the interaction. The block handles the call transfers and conferences internally and only ends when the remote party disconnects or the last agent disconnects.

For descriptions of this block’s screen properties, see the Scenario Builder Reference Guide, section Connect Chat.

Exit

The Exit scenario block disconnects the currently active interaction and exits the scenario.

For descriptions of this block’s screen properties, see the Scenario Builder Reference Guide, section Exit.




Using Messenger on Agent Desktop

After you have configured your integration account, Facebook App, Facebook Page, and scenarios, your organization’s agents can accept and respond to chat interactions from the Agent Desktop application.

Designed to increase agent productivity, the Bright Pattern Contact Center Agent Desktop application displays only the controls and information needed at each point of work.

Incoming chat interactions are routed to agents using the Messenger Chat scenario that you created in the previous section of this guide. Facebook Messenger interactions are delivered as “Customer Service Chats” and look no different than other web chats or mobile chats that are normally sent to agents.


Chatting on Messenger from the Agent Desktop


Login

  1. Log in to Agent Desktop with your username and password, being sure to select your desired phone device.

  2. By default, you log in with a softphone. To choose another device, click the current Phone device setting and select the desired type of device from the menu that appears. For more information about the available device options, see the Bright Pattern Contact Center Agent Guide, section Selecting a Phone Device.

  3. Click the Login button.

  4. Note that if this is your first time logging into Agent Desktop on the given computer, you will be prompted to install the Agent Desktop Helper Application.


Ready State

Setting the agent state to Ready will allow incoming chat interactions to be routed to you. Agents can accept or reject chat interactions while logged in and ready. If accepted, the customer’s message is shown in the Chat Panel of Agent Desktop in the same manner as any other web chat or SMS text. All of Agent Desktop’s features and controls are available in the integrated interface.

Agents can:


Refer to the Bright Pattern Contact Center Agent Guide to learn more about the Agent Desktop user interface and its applications.





Customer View

For the customer, the conversation looks the same as any other Facebook Messenger conversation.


Facebook Messenger conversation on mobile