Skip to main content


         This documentation site is for previous versions. Visit our new documentation site for current releases.      
 

Configuring the Web Chatbot

Updated on June 1, 2022
Caution: Legacy Webchat previously known as Web Chatbot is deprecated. To start the migration to Web Messaging, see Migrating from Legacy Webchat to Web Messaging.

The Web Chatbot acts as a primary touchpoint for all the chat conversations initiated by the customers. When customers come in with a service request, the Web Chatbot offers them various self-service options, including proactive chat, self-service cases, and knowledge articles.

Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide Pega Customer Service Implementation Guide

Suppose the customers specifically ask, or the application detects the bot failure in assisting the customer, the web chatbot sends the live chat request to appropriate queues based on the customer request. The routing engine then routes the customers to the right CSRs. For more information, see Queues and routing.

Pega Customer Service's self-service application provides a sample Web Chatbot channel that can help you get started quickly with the configuration. The sample Web Chatbot channel consists of the most frequently used case types, such as Chat with agent, Request a statement copy, and Make Payment.

Using the combination of pre-defined and configurable system responses, response commands, and text analysis, the AI-powered Web Chatbot interprets the customer conversation and sends appropriate automated responses. The sample Web Chatbot channel also provides out-of-the-box queues, such as Billing, that route customers to the best CSR available for that job. The Web Chatbot channel's training data quickly answer customer inquiries without the CSR intervention.

You can add a custom self-service configuration in the channel to implement styling and additional self-service options in the chat window. Using the self-self service configurations, you can customize the chat window to suit your organization's branding requirements, enable proactive notifications, and configure relevant knowledge articles that the customers can see before interacting with the bot. For more information, see Adding a self-service configuration for a Web Chatbot channel, later in this topic.

The pre-configured sample Web Chatbot channel is a quick option to set up your initial web chatbot channel without configuring the case types and responses once again. If you prefer not to use the pre-defined sample Web Chatbot channel, you can create a new Web Chatbot channel. For more information, see Creating the Web Chatbot channel, later in this topic.

Note: In Pega Customer Service version 8.6 and later, Web Chatbot is called Legacy Webchat.

Creating the Web Chatbot channel

Create the Web Chatbot channel to configure the Pega Intelligent Virtual Assistant (IVA) for Pega Chat. Using the Web Chatbot channel, customers can use the self-service options such as executing service cases, reading the configured knowledge articles to resolve issues, and, if needed, escalate to live chat to interact with CSRs. After configuring the Web Chatbot channel, you can deploy the chat widget on a customer-facing website using which the customers can start interacting with Pega Customer Service.

  1. Log in to the Self-Service application with the administrator credentials.
  2. In the navigation pane of App Studio, click Channels. The system displays the Channels landing page.
  3. On the Channels landing page, in the Create new channel interface section, click Web Chatbot.
  4. In the New Web Chatbot interface page, on the Configuration tab, in the Details section, perform the following tasks:
    1. In the Channel interface name field, enter a name for your Web Chatbot channel interface
    2. Optional: In the Description field, describe the purpose your Web Chatbot channel interface
  5. To add cases for the Web Chatbot that help your customer to open and access a case by entering a specific command, click Add case type.
    1. In the Case type list, click the name of the case to create when the user enters the command.
    2. In the Create case command field, enter or modify a user command for the case to be created.
    3. Click Submit.
  6. To add custom responses for the Web Chatbot so that users, by entering a specific command in the chat window, can perform an action such as viewing available menu options, click Add response.
    1. In the Response type list, click the name of the response to provide when a user enters a command.
    2. In the Response command field, enter or modify the user command that the response will provide.
    3. Optional: In the Response text field, enter the response text to display to the user. You can select a predefined response by clicking Use existing.
    4. Click Submit.
  7. Configure chatbot system responses. For more information, see Configuring system responses for a conversational channel.
  8. Configure chatbot text analyzers. For more information, see Defining topics for text analysis for an IVA.
  9. Click the Connection tab.
  10. In the Template operator ID list, click the name of an existing self-service operator to use as the template.

    The value selected in the Template operator ID list specifies the name of an existing operator and is used as a template from which all accounts are created. Each account has a unique web chatbot identifier set as its ID.

  11. Click Save.
    For information about access groups in Pega Customer Service, see Creating a self-service application.
    After creating and configuring the behavior of a Web Chatbot channel, you can add Web Chatbot widgets or Self-Service configurations to the Web Chatbot channel. For more information about how to add the configuration, see Adding a self-service configuration for a Web Chatbot channel, later in this topic.

Escalating chat requests directly to an agent

When customers initiate a conversation request from a supported channel, they interact with a bot as the first resolution path. To bypass bot interactions for conversation requests, change the bot configuration to escalate directly to the Customer Service Representatives (CSRs).

To bypass web chatbot interactions and allow customers to directly reach CSRs, perform these steps:
  1. In the Dev Studio enter and search SetCommandOnLoad.
  2. Open the Set command on load data transform.
  3. Set the value of the Param.input property to the value that you configure for the Chat with agent case type, in the web chatbot configuration.
    For example: Talk to agent.
  4. Set the value of the Param.display property to the same value that you specified for Param.input.
  5. Click Save.

Defining web pages to push for chat

During a chat session, a customer service representative (CSR) can select a chat-enabled web page to share with a customer in order to guide them or point them to the information that they need. The customer receives a message asking for permission to redirect their web browser to the pushed page.

For more information on configuring page push, see the Configuring Page push section in Page push. For more info on using the page push during the live chat, see the Using page push during the live chat section in Augmented Agent during live chat.

Adding a self-service configuration for a Web Chatbot channel

Create self-service configurations for a Web Chatbot channel to define the appearance of the Pega Customer Service chat button or tab on your website, the end-user chat window, and to configure the Proactive chat feature and help articles in the Web Chatbot channel. By using the Self-Service Configuration tab on the Web Chatbot channel interface, you can create one or more self-service configurations and then deploy different self-service configurations on different websites, based on your branding requirements.

  1. Log in to the Self-Service application with the administrator credentials.
  2. In the navigation pane of App Studio, click Channels. The system displays the Channels landing page.
  3. On the Channels landing page, in the Current channel interfaces section, click the name of the channel to create a self-service configuration for a Web Chatbot channel.
  4. On the Web Chatbot interface window of the channel, click the Self-Service Configuration tab.
  5. Click Add self-service configuration.
  6. Enter a name for the self-service configuration, and then click Add.

    Perform the following tasks in the Web Chatbot channel's self-service configuration:

Implementing end-user chat window branding

Configure the appearance of the Web Chatbot button, end-user chat window, and header to reflect your website's theme. You can create multiple self-service configurations for Web Chatbot channels, to suit the branding requirements of different websites.

  1. Log in to the Self-Service application with the administrator credentials.
  2. In the navigation pane of App Studio, click Channels. The system displays the Channels landing page.
  3. On the Channels landing page, in the Current channel interfaces section, click the name of the channel to edit the self-service configuration of a Web Chatbot channel.
  4. In the Web Chatbot interface window for the channel, click the Self-Service Configuration tab.
  5. To edit the styles of a self-service configuration, select a configuration from the list, and then click the Appearance tab.
    As you configure the styles, the chat window on the right shows a live preview of your settings.
  6. To configure the name that appears in the header of the chat window, in the Chat headerfield, enter some text.
  7. To display an image on the left side of the chat header text, for example, your company logo, click Upload and then select an image.
    Images that you upload are resized to 30 by 30 pixels.
  8. To select the type of chat window launcher on the website, in the Launchersection, select Tab or Button.
  9. Enter the text you want to display on the help launcher tab or button in the Help tab/button text field.
    For example: Need help?
  10. To allow end-users to change the size of their chat text, select the Enable font resizing check box.
    Result: End-users can see three selectable font size icons in the header of the chat window. The default size is 18px, and the other two options are 20px and 22px.
  11. To configure the default dimensions of the chat window, complete the following fields in the Dimensions section:
    1. Height: Enter the default height for the chat window when it opens.
    2. Width: Enter the default width for the chat window when it opens.
    3. Compact height: Enter the default height for the chat window in compact mode.
  12. To configure the font family and colors for the end-user chat window, end-user interactions, and the bot or agent interactions, complete the following fields in the Colors and fonts section:
    1. Font family: Select a font family for the text shown on the help launcher and the chat window header.
    2. Link color: Select the background color for the chat window launcher tab or button.
    3. Header text color: Select the font color for the text shown on the chat window. header.
    4. Header background color: Select the background color for the text shown on the chat window header.
    5. Bot/Agent Settings: Select the font color, font family, and the background color for the CSR or bot text messages.
    6. Customer Settings: Select the font color, font family, and the background color for the customer text messages.
  13. Click Submit.

Configuring Pega Knowledge help categories in Web Chatbot

Configure relevant Pega Knowledge help categories that the system can show to customers when they open a Web Chatbot window. Customers can navigate the help articles using embedded links. If the customer wants to talk to the Web Chatbot, they can click the Need help? icon at any time.

For more information, see Delivering Knowledge Management articles with Intelligent Virtual Assistant channels.
  1. Log in to the Self-Service application with the administrator credentials.
  2. In the navigation pane of App Studio, click Channels. The system displays the Channels landing page.
  3. On the Channels landing page, in the Current channel interfaces section, click the name of the channel to edit the self-service configuration of a Web Chatbot channel.
  4. On the Web Chatbot interface window of the channel, click the Self-Service Configuration tab.
  5. To configure Pega Knowledge articles in the Web Chatbot, select a configuration from the list, and then click the Help Categories tab.
  6. In the KM Welcome message field, enter the message that you want the customer to see when they open the chat window.
    For example:

    Hi! I'm a Pega Chatbot and I've got a whole bunch of useful articles to share with you.

    Let's get started- what do you want to do?

  7. In the Help Categories section, click Add category .
  8. Click Select to display a list of all the available help categories.
  9. Click the name of the category that you want to add.
  10. Optional: Repeat steps 5 to 7 to add more help categories.
  11. Click Submit.

Configuring proactive notifications

Configure proactive notifications in your self-service configuration so that you can send relevant information, offers, and service cases to your customers proactively, based on their customer and account profile. If you enable proactive notifications, Pega Customer Service interacts with Customer Decision Hub (CDH) when a customer visit your website, to predict the customer's needs and offer bot-enabled assistance. In this way, proactive notifications can save the customer's time and make the work of the Customer Service Representatives (CSRs) more efficient.

For example, if a customer whose bill has increased by USD 25 in the current month logs in to your website, one possible reason is that they want to check their billing history. If CDH determines that a notification should be sent to the customer, the Web Chatbot window slides open with a relevant message and links to either make a billing inquiry or close the notification. You can also configure the notification window to minimize after a specified amount of time if the customer ignores it.
  1. Log in to the Self-Service application with the administrator credentials.
  2. In the navigation pane of App Studio, click Channels. The system displays the Channels landing page.
  3. On the Channels landing page, in the Current channel interfaces section, click the name of the channel to edit the self-service configuration of a Web Chatbot channel.
  4. In the Web Chatbot interface window for the channel, click the Self-Service Configuration tab.
  5. Select a configuration from the list, and then click the Proactive tab.
  6. To enable proactive notifications, select the Enable proactive notifications check box.
  7. To use CDH to generate proactive notifications instead of the default Pega Customer Service functionality, in the Proactive service URL field, enter the URL of the CDH application that is integrated with the Pega Customer Service application instance.
    The response to the REST call made to the URL should contain the following parameters in the .RankedResults() page:
    • ClassName
    • Greeting
    • Reason
    • AcceptText
    • DeclineText
    In the PegaHelper.js file of the chatbot, the setDynamicChatGadgetParams( ) function uses these values to render the proactive notifications display.
  8. To minimize the notification window after a specified time if the customer ignores it, select the Enable Minimizing check box.
  9. In the Minimize window after field, enter a number of seconds after which to minimize the notification window.

Deploying Web Chatbot

After you build and configure the Web Chatbot channel along with its self-service configuration, deploy it on a supported web server.

  1. Log in to the Self-Service application with the administrator credentials.
  2. In the navigation pane of App Studio, click Channels. The system displays the Channels landing page.
  3. On the Channels landing page, in the Current channel interfaces section, click the name of the channel to edit the self-service configuration of a Web Chatbot channel.
  4. In the Web Chatbot interface window for the channel, click the Self-Service Configuration tab.
  5. Select a configuration from the list, and then click the Download tab.
  6. To change the default Pega application URL used by the self-service configuration, click the edit icon next to the URL.
  7. To create and download the Web Chatbot as a ZIP file archive, click the Download link.
  8. Extract the file from the downloaded ZIP file archive and copy the resulting folder to your web server.
    To test your deployment, open your web browser and enter the web server path to where you deployed the Web Chatbot.
    For example: http://example.com/webchatbot

Passing custom data to the bot

When a customer opens the bot, the bot captures the necessary details to identify the customers and associate the conversation with the corresponding account. The PegaHelperExtension.js file captures the following information from the website to pass on to the Pega Customer Service application by default:

  • pegaAParamObj.ContactId
  • pegaAParamObj.AccountNumber
  • pegaAParamObj.username
  • pegaAParamObj.CustomerURL
  • pegaAParamObj.Language
Sometimes you need to capture different or additional customer information depending on your organization needs. For example, if you are an insurance organization and the customers use their policy number to sign in to the website for chats, the PegaHelperExtension.js can be modified to capture the customer's policy number instead of the contact ID. To customize the data captured by the bot, follow these steps:
  1. In the downloaded self-service configuration folder of your bot channel, open the PegaHelperExtension.JS file.
  2. In the preparePegaAParams function, add the new key-value pairs.
    For example: pegaAParamObj.policyId = “123456789”
  3. In the Work-Channel-Chat class, create a new property to hold that value.
  4. In the Work-Channel-Chat class of your self-service application, update the pyDefault data transform to set .myServer to param.myParam.
  5. Copy the value set in the SetContactContextWebChatBot data transform to copy to the pyInteractionCase page.
    pyInteractionCase page is the context of the bot interaction.
  6. To set the properties from pyInteractionCase to the chatinteraction page, which is used while routing the request, use the cyInvokeRoutingExtn data transform.
Result: When the customer escalates the bot interaction to a CSR, the ToasterPopForChat activity copies the items from the chatinteraction page to the CSR side chat interaction page.

Tags

Pega Customer Service 8.5

Have a question? Get answers now.

Visit the Support Center to ask questions, engage in discussions, share ideas, and help others.

Visit the Support Center

Did you find this content helpful?

Yes
No

Want to help us improve this content?
Suggest an edit

We'd prefer it if you saw us at our best.

Pega.com is not optimized for Internet Explorer. For the optimal experience, please use:

Close Deprecation Notice
Contact us