Messaging/Chat

Messaging/Chat scenario entries are used to associate scenarios with contacts requested via mobile and web applications.

To set up and manage such associations, select the Messaging/Chat option from the Scenario Entries menu.

Messaging/Chat Scenario Entries Screen Properties

The Messaging/Chat Scenario Entries screen properties are described as follows.

Name

Name is the name of this messaging/chat scenario entry. This field is mandatory and must be unique within the contact center.

Unique identifier

The Unique identifier is generated by the system for this scenario entry. This identifier must be used as Application ID in the mobile and/or web applications that will connect to your contact center via this scenario entry. For more information, see section General Information of the Bright Pattern Mobile/Web API Specification.

Scenario

Scenario is the Chat scenario that will process chat requests arriving via this entry point.

Service

This is the service associated with this scenario entry. Entering a service is optional. See the corresponding description for the Dial-in scenario entries for more information.

Default service for voice callback

Select the voice service to be used when a customer requests a voice callback during a mobile or web chat interaction. The Default service for voice callback drop-down menu displays the voice services that have been added to Services & Campaigns.

Hours of Operation

Hours of Operation (HOP) refers to the schedule for this scenario entry point. This field is optional. See the corresponding description for the Dial-in scenario entries for more information.

Web HTML snippet

Web HTML snippet provides access to the web elements of the chat application that customers will use to access your contact center via the given scenario entry.

You can either use an out-of-the-box chat application hosted by your service provider, or you can create your own application.

To use the out-of-the-box application, click the HTML snippet button, copy the HTML snippet code, and embed it into your web page(s). Normally, it is not necessary to change the default client web server hostname. You will do so only if instructed by your service provider.

To create your own application, click the Client application button. A zip file with the code of the out-of-the-box application (see above) will be downloaded to your computer. You can modify this code to match the look and feel of your company website, and implement additional application functionality using the Mobile/Web API.

Requested skills

Requested skills are the auxiliary skills that the agents must possess in order to handle chats arriving through this scenario entry. This field is optional. See the corresponding description for the Dial-in scenario entries for more information.

Parameter expected

A parameter expected is the parameter that may be expected by the scenario in session requests coming from the mobile applications (e.g., customer’s name). Such parameters are optional. They may be used, for example, to look for the most qualified agents to handle the requested chat sessions and/or to display user information for the agents. For more information, see section Expected parameters of the Mobile/Web API Specification.

To define a new parameter, click add, select the parameter type, and specify its name. To edit or remove existing parameters, hover over their names.

SMS/MMS access numbers

Bright Pattern Contact Center enables customers to request and carry on chat conversations via SMS or multimedia messaging service (MMS). Such chat requests are initially made to a dedicated access number. Subsequent treatment of such requests, including routing, Agent Desktop, and reporting, is no different from the processing of regular chat sessions.

Use this setting to specify the number that the customers will use to initiate such SMS/MMS chat conversations. Note that this must be an enabled access number assigned to you by the service provider and dedicated to SMS/MMS communications (i.e., an access number that appears in the [number]/SMS/MMS format in the Access Numbers list view).

You can assign more than one access number to one scenario entry, but the same number cannot be assigned to multiple entries.

Messenger Accounts

Agents can participate in live chats initiated from a customer’s messenger account (e.g., Facebook Messenger, LINE, Telegram, Viber, etc.). Messenger integration accounts that are configured for your call center can be selected from the Messenger accounts drop-down menu. To add a messenger account to your Messaging/Chat scenario entry, click add and select the desired account.

Bot / Chat suggestions engine

Our system integrates with chat bots to provide meaningful suggestions to an agent during chat session, as well as bot functionality for customers to complete self-service tasks without the assistance of a live agent. From the Bot / Chat suggestions engine drop-down menu, you can select one bot / chat suggestion engine integration account as a suggestion engine per service. One such integration account can be selected as chat bot on the chat service launch point. The default engine is None.

Connect agent by phone automatically

Any mobile application contact is initially presented to the agent as a chat request. However, if the mobile application transmits the customer’s mobile phone number, this number will be displayed at the Agent Desktop, and the agent can call the number to establish a voice call with the customer. Select the Connect agent by phone automatically checkbox if you wish for such voice calls to be initiated automatically whenever the phone number is available.

Connect after delay of

If you selected the Connect agent by phone automatically checkbox, you can define how quickly the automated call to the customer mobile number will be initiated. A slight delay may be desirable if, for example, the agent needs some time to review information that comes with the original request.

Queuing priority

Queuing priority is the priority of interactions arriving through this scenario entry. This field is optional. See the corresponding description for the Dial-in scenario entries for more information.

Chat nick for system messages

Chat nick for system messages is the name that will be displayed to the customers when they get automated chat responses through this scenario entry (e.g., during an initial data collection stage). By default, this is the name of your contact center (tenant name) that is defined at the service provider level.

How long an agent could wait for reply before chat times out

This is the amount of time (in minutes) that an agent could wait for a reply before the chat interaction expires. It can be redefined for each Messaging/Chat scenario entry separately.

This setting overrides the Customer Inactivity Timeout setting.

How long a client browser may stay unresponsive before chat times out

This is the amount of time (in minutes) that the client's browser may stay unresponsive before the chat interaction expires.

Visible to agents

Visible to agents indicates whether this scenario entry shall appear in the Agent Desktop directory. See the corresponding description for the Dial-in scenario entries for more information.

Checking this box enables agents to transfer chats to another chat directory. In order to be able to transfer chats to another chat scenario, the Messaging/Chat scenario entry must be updated to be visible to agents and have a directory that is named for the transfer. For more information on how agents transfer chats, see the Agent Guide, section How to Transfer Your Chat Session.

Directory folder

Directory folder is the folder of the Agent Desktop directory where this scenario entry will appear if enabled by the previous option. See the corresponding description for the Dial-in scenario entries for more information.

Scenario parameters

Scenario parameters are optional. See the corresponding description for the Dial-in scenario entries for more information.

Chat session icon

The chat session icon appears in the customer-facing chat window during active chat sessions. You have the option of uploading an icon (e.g., logo, photo, etc.) on a system-wide level, which will be seen in chat windows for all customers interacting with agents in your tenant. If uploaded, this icon overrides photos that agents have uploaded to their User Profile in the Agent Desktop application, which are normally seen by customers in their active chat windows.

Leaving this field empty or removing a chat session icon allows chat windows to display the photo that an agent has uploaded to his or her User Profile (if available).

For example, agent Christy Borden has uploaded a photo to her User Profile, as shown. The agent's uploaded photo appears in the customer's active chat window.

Uploading a chat session icon causes the agent's photo in the chat window to be replaced by the icon that you uploaded. Note that you must click Apply to save your changes. Also note that the chat session icon that you upload does not override agents' User Profile photos--only the display photos shown in active chat windows.

In all new chat interactions, the customer's chat window will display the chat session icon that you have uploaded. In addition, web notifications that pop on agent replies when the visitor's browser window with chat is minimized, or overlapped by other windows, will also contain the chat session icon for all agents. Note that web notifications are not supported for Internet Explorer 11 (IE11).

Co-browsing

During a web chat, co-browsing functionality allows the agent to view the customer’s screen and follow the customer’s scrolling movements. Co-browsing is initiated during the chat by the customer--not the agent--and screen sharing ends when either the customer clicks the Co-browsing button or when the chat is terminated.

Co-browsing is configured in the code (see section HTML Snippet above) of the chat application that customers will use to access your contact center. To allow and configure co-browsing for your web chats, you must have system access to either your tenant’s HTML snippet code and/or your organization’s web page itself.

How to Enable Co-browsing

1. In Contact Center Administrator, navigate to Scenario Entries > Messaging/Chat.
   
   
2. Select the desired chat scenario entry.
   
   
3. In the Properties pane, click the HTML snippet button, and copy all of the code to your clipboard.
   
   
   

   HTML Snippet
   
   
   
4. Paste the copied HTML into a text editing application (e.g., Notepad++) to edit it.
   
   
5. In the HTML, make two changes:
   
   
   1. Insert a comma AFTER chatPath: 'https://five.brightpattern.com/clientweb/chat-client-v4/'
      
      
   2. Hit Return and insert the following: togetherJS_enabled : true,
      
      
      
      
      
      
6. Copy all and paste the edited HTML onto your web page. This embeds the chat application into your webpage.
   
   
7. Publish the webpage and refresh any active chats.

How Co-browsing Works

This additional code (togetherJS_enabled : true,) causes the chat application to display the Co-browsing button to customers during active chats. When the customer clicks the Co-browsing button, a request is sent to the agent in the chat message.

When the agent accepts the request, the customer’s screen appears on the agent’s screen. The agent can follow the customer’s scrolling movements and view the customer’s screen only.

A hand icon, along with the label “Viewer”, is displayed on the customer’s screen to indicate that an agent is currently viewing the screen in Co-browsing mode. Similarly, the agent will see a circle icon that indicates the agent is viewing the customer’s screen.

Co-browsing is turned off when the customer clicks the Co-browsing button again on the active chat window.

Chat widget

The chat widget provides access to the web elements of the chat application that customers will use to access your contact center via the given scenario entry. The chat widget may be customized for color, size, fonts, font size, display elements, and more.

To edit the chat widget, click customize. The Chat Widget Configuration window will open. For more information, see the Chat Widget Configuration Guide.

Chat transcript template

The chat transcript template allows you to configure an email template for the purpose of sending chat/messaging transcripts. Note that this chat transcript template is specific to the given Messaging/Chat Scenario Entry; if the template is not defined, the template defined at the system level will be used.

In order for transcripts to be emailed, you will need the following:

• A configured SMTP server - In order for the system to automatically send emails, you will need complete SMTP Configuration.
• A configured pre-chat form with an email field - Transcripts are emailed to the address(es) specified in fields containing the variable $(item.email) when the session ends.
• A chat scenario containing $(item.sendTranscript) - In the corresponding chat scenario, you must include a Set Variable scenario block with the variable $(item.sendTranscript); the value must be set to 1 in order for the transcript to send.

When configuring the settings in this section, you will need the following:

• A sender display name
• A sender email address
• The chat transcript variable - When configuring the template message, you must include the variable $(CHAT_TRANSCRIPT). This variable inserts the transcript into the message.

Web Chat Configuration

This procedure explains how to configure a chat scenario, chat service, and chat scenario entry point to work together to display a chat widget on your website. By the end of this procedure, you should have a working chat widget on a webpage that connects customers to your contact center.

Step 1: Create or Select a Chat Scenario

1. Go to Configuration > Scenarios > Chat.
   
   
   

   Configuration > Scenarios > Chat
   
   
   
2. Either select an existing Chat Scenario from the list, or click the Add from template button at the bottom of the screen to create a new chat scenario from the “Mobile Chat” template.
   
   
   

   Select the "Mobile Chat" template
   
   
   
3. Creating a new chat scenario from a template will open the Scenario Builder application in a new browser tab or window. For the purpose of this simple setup, leave the scenario as-is and click Save.
   
   
   

   Name the scenario
   
   
   
4. Give the scenario a unique name (e.g., "Super Chat") and click Save. Your new scenario will appear in the list of scenarios.

Step 2: Create or Select a Chat Service

1. Go to Configuration > Services & Campaigns and choose a chat service to use with your chat scenario.
   
   
2. If there are no existing services of type “Chat,” you have to create one.

How to Add a New Chat Service

1. Click the Add service button and select Chat.
   
   
   

   Select the service called "Chat"
   
   
   
2. In the Properties tab, fill out the service properties as appropriate, and click Apply.
   
   
3. At the most basic level, give the new chat service a name (e.g., "Pacific Chat"). For definitions of each property, see the Contact Center Administrator Guide, section Properties Tab.
   
   
   

   Services & Campaigns > Properties
   
   
   
4. Next, you need to assign a team, an administrator, and a reviewer (optional) to the service. This is done in the Assignments tab.
   

   Assign a team and administrator to the service

Step 3: Create or Choose a Chat Scenario Entry

1. Go to Configuration > Scenario Entries > Messaging/Chat and select a scenario entry point to use with your chat scenario. The entry point is what starts the scenario.
   
   
   

   Messaging/Chat scenario entries list
   
   
   
2. If there are no existing chat scenario entries shown, you have to create one.

How to Add a New Chat Scenario Entry

1. Click the Add chat scenario entry button.
   
   
2. In the Properties tab, fill in the properties as appropriate (see below for required and optional properties). For definitions, see the Contact Center Administrator Guide, section Messaging/Chat.

Required Properties

In the Properties tab, make sure to address the following fields right now. These are critical to chat configuration.

• Name - The unique name (any) of the chat scenario entry (e.g., "Redwood Chat")

• Unique identifier - An automatically generated, long string of characters that identifies the chat entry. It is recommended that you change it to something short and unique (e.g., "1234").

• Scenario - Choose the Chat Scenario you selected or created in step 1 of this procedure (e.g., "Super Chat"). This is where the parts come together to make chat possible.

• Service - Choose the Chat Service you selected or created in step 2 of this procedure (e.g., "Pacific Chat"). This is where the parts come together to make chat possible.

Other Properties

The remaining properties are optional at this time. You can come back to them later.

• Default service for voice callback - Select a voice service if your agents will need to make a call (note: it needs to be a voice service).

• Merge sessions for identified contacts - This checkbox is what makes omnichannel possible (i.e., a recognized Facebook Messenger chat session or a recognized phone number can be merged together).

• Web HTML snippet - Come back to this button after you have completed and saved all your properties options. The HTML snippet is what you will be embedding into your webpages in order to make chat functional

• Full chat code for local hosting - Click this if you will be customizing chat and hosting it on your own website. Bright Pattern provides this code for customers whose websites do not accommodate integration with Bright Pattern chat.

• Requested skills - The auxiliary skills that agents need in order to accept a chat

• SMS/MMS access numbers - Phone numbers that will be used for receiving/sending SMS/MMS messages from/to customers. All incoming messages to this account will start the chat scenario. If no such accounts are not selected here, your scenario is strictly web chat.

• Messenger Accounts - The social messenger accounts that will be used for receiving/sending messages from/to customers. All incoming messages to this account will start the chat scenario. Note that in order to use messenger accounts, messenger integration accounts must be configured for your contact center. If no such accounts are not selected here, your scenario is strictly web chat.

• Bot / Chat suggestions engine - The engine that will provide suggested replies to the agent during chat. Note that in order to use a bot/chat suggestions engine, you must have an integration account configured for your contact center.

• Connect agent by phone automatically - When selected, this option enables automatic connection of an agent to a phone number that a customer sends. If not selected, the agent must take the additional step to dial a number manually.

• Connect after delay of - If Connect agent by phone automatically is selected, you may configure a delay (in seconds) for the connection between agent and customer.

• Queueing priority - The priority level of the customer in the queue (e.g., “1” is high priority, “3” is low, etc.). Leave the queuing priority as-is unless you want to de-prioritize the caller.

• Chat nick for system messages - The name for this scenario entry that will be shown with system messages sent to customers in the chat (e.g., “Redwood Customer Service has joined the chat!”)

• How long an agent could wait for reply before chat times out - The amount of time (in minutes) between replies for the session to timeout

• How long a client browser may stay unresponsive before chat times out - The amount of time (in minutes) that the browser has been idle for the session to timeout. Note: If you are in an area where service is bad, you may want to increase the timeout.

• Visible to agents - When this checkbox is selected, this scenario entry will appear as an entry for all new chat sessions and chat transfers (e.g., agents can receive the chat from a different service). Note that services are added in the Directory folder.

• Scenario parameters - This section will be deprecated.

• Chat session icon - Allows you to set an image to this scenario entry (i.e., in chat, will override the agent’s image in the chat widget). This property will be deprecated. The chat session icon can be added in Chat Widget configuration. See section Chat Widget tab > Chat Styling > Show agent pic.

Step 4: Edit Chat Widget Style

You can edit the appearance (i.e., color, font size, location, etc.) of the chat widget in the Chat Styling section. This step is important to complete; if you don't do this, your contact tab (see Step 5 of this procedure) will not appear in preview.

1. Click on the Chat widget tab.
   
   
2. Beneath Chat Styling, click edit.
   
   
   

   Chat Styling > edit
   
   
   
3. The Chat Widget Configuration editor will open in a new browser tab or window. Edit the Chat Widget Styling properties and fields as desired. At the most basic level, you can leave everything as-is at this point and save your changes. You can come back to this later.
   
   
   

   Chat Widget Configuration editor in new browser tab/window
   
   
   
4. At the bottom of the screen, click Save.

Step 5: Add a Contact Tab

In order for this chat scenario entry to work, you must add a contact tab for the chat widget. If you don’t do this, your webpage will not display the chat widget!

1. Click on the Chat widget tab.
   
   
2. Beneath Chat Initiation via Contact Tabs, click add.
   
   
   

   Add a new contact tab
   
   
   
3. The Chat Widget Configuration editor will open in a new browser tab or window. Edit the properties and fields as desired.
   
   
   

   Chat Widget Configuration editor in new browser tab/window
   
   
   
4. Optional: To preview how the contact tab will look on your webpage, enter your URL in the Preview URL field and click Apply. Your webpage will load on the screen with the contact tab on it, and you will be asked to confirm whether you see the content.
   
   
   

   Example preview URL shows the webpage but not the chat widget
   
   
   Some websites are protected from being embedded into third-party websites; if this is the case, you will see the message “Chat widget not found!” in red. To preview the contact tab without your webpage displayed, leave the Preview URL field empty.
   
   
   

   When left empty, Preview URL shows no webpage content
5. Required: At the most basic level, these actions are required right now:
   
   * Name - The unique name (any) for this new contact tab
   
   * Save - Click to save changes
   
   
6. Back in the Chat widget tab, go to Chat Initiation via Contact Tabs.
   
   
7. Beneath the contact tab you just added, click add url.
   
   
   

   Make sure you add the URL of your webpage
   
   
   
8. Enter the URL of the website where the chat widget will be placed, and click the green checkmark to apply your changes.
   
   
   

   Apply changes or cancel
   
   
   
9. Optional: At this time, you may add or edit any of the other Chat widget tab sections. You can always come back to this for further changes.
   
   
10. At the bottom of the screen, click Apply to save your changes.

Step 6: Get the HTML

1. Go back to Properties tab > Web HTML snippet.
   
   
2. Click the HTML snippet button. The HTML snippet is the code for the chat widget you just configured.
   
   
   

   In the Properties tab, click "HTML snippet"
   
   
   
3. The HTML Snippet for Web Page dialog will open.
   
   
   

   HTML Snippet for Web Page dialog
   
   
   
4. In the field Specify client web server hostname, enter your contact center’s name (i.e., “five.brightpattern.com”). If you don’t know what it is, look at the URL of your Contact Center Administrator application in the web browser. The hostname is the name that appears before “/admin”.
   
   
   

   Example of client web server hostname in browser address field
   
   
   
5. Click Copy to clipboard to copy the HTML. This is the code of the chat widget.
   
   
6. Paste the HTML onto the appropriate place on your webpage and publish. The chat widget contact tab (and any other chat widget elements that you added in chat widget configuration) will appear on the page.
   
   
   

   Chat widget on an example webpage
   
   
   

On the webpage, clicking on the contact tab will expand the widget.

If you do not see the chat widget on your page, revisit the previous steps of this procedure and try again.

For more information on chat widget configuration, see the Chat Widget Configuration Guide.

Chat Widget Auto-Start

You may configure the chat widget to initiate a chat session automatically upon a webpage loading. With this configuration, no customer action is required to launch the widget and, when the webpage is loaded, the chat automatically connects to an agent or the queue.

To do this, follow these steps:

1. Open the HTML Snippet for Web Page.
2. Paste the copied HTML into a text editing application (e.g., Notepad++) to edit it.
3. In the "Service Pattern Chat Config" object, add the attribute autostartChat with the value true. Note that the default value is false.
4. Copy all and paste the edited HTML onto your web page.
5. Publish the webpage and refresh any active chats.

The following is an example of how this looks in the HTML Snippet for Web Page.

SERVICE_PATTERN_CHAT_CONFIG = {
        ...
        autostartChat: true,
        ...
    };