Configure a Chat Channel

You can configure many aspects of your chat messaging Asynchronous chat in which contacts send a chat message anytime and wait for a reply or live chat Agents and contacts interact on a real-time basis channels A way for contacts to interact with agents or bots. A channel can be voice, email, chat, social media, and so on.. If you have more than one channel of either type, you can configure each one separately to meet the needs of your organization.

Customize Chat Widget

The chat widget appears on your website so customers can start either a chat messaging Asynchronous chat in which contacts send a chat message anytime and wait for a reply or live chat Agents and contacts interact on a real-time basis session with your organization. If you have more than one chat channel A way for contacts to interact with agents or bots. A channel can be voice, email, chat, social media, and so on., you can have a different widget appearance for each.

1. Click the app selector and select ACD.

2. Go to Digital > Points of Contact Digital.

3. Click Chat.

4. Click Customize CSS and JS for the channel you want to configure.

5. You can add custom content using CSS or JavaScript (JS). This is where you can customize content for the Adaptive Card messaging framework.

   View image

   
   View an example of how to customize Adaptive Cards

   Custom CSS:

   button.ac-pushButton {
      color: #faac4b;
      background: white;
      padding: 10px;
      border: 1px solid;
      border-radius: 10px;
      cursor: pointer;
   }	

   Custom JS:

   window.addEventListener('load', function() { 
       if (!window.MutationObserver) {
         return;
       }
       var iframeObserver = new MutationObserver(function(){
         var button = document.querySelector('.ac-pushButton');
         if (button) {
           button.onclick = function () { 
               alert('roshan');
           };
         }
       });
       iframeObserver.observe(document.body, {
         attributes: true,
         subtree: true,
         childList: false,
         characterData: false
       });
   });

6. Click Save.

Customize the Precontact Survey Form

The precontact survey form collects information about a contact before starting a chat session. Once you create a form, you can create and configure custom fields to appear on the precontact survey. Both live chat Agents and contacts interact on a real-time basis and chat messaging Asynchronous chat in which contacts send a chat message anytime and wait for a reply channels have precontact survey forms by default. If you don't want the survey form to appear for some chat channels or on certain pages on your website, you can customize the initialization script for those channels or pages using JavaScript commands. You can also assign specific channels to use precontact surveys.

Add Language Variants for Localization

Labels in the digital chat window automatically display in the same language that a contact has set in their browser. You can add language variants besides those languages supported for default translation. You can set a fallback language for the chat to use if translation isn't available for certain options.

Once you have added a language, you can modify common and automated chat phrases. This lets you customize the wording of translations to fit your organization's needs.

This option is available for chat messaging Asynchronous chat in which contacts send a chat message anytime and wait for a reply or live chat Agents and contacts interact on a real-time basis channels.

1. Click the app selector and select ACD.

2. Go to Digital > Points of Contact Digital.

3. Click Chat.

4. Click Translations next to the desired channel.

5. Click Add Language.

6. Enter a Name for the language variation you would like to add.

7. Select a Language from the drop-down.

8. Select a Country from the drop-down. If you don't select a country, the language displays to anyone using that language in their browser setting. Translations marked with a country take precedence over languages without a country.

9. Choose a Fallback language from the drop-down. This displays in the chat if there is no available translation for a particular option. If you don't set a fallback language, the text displays in English.

10. Click Save.

11. If you want to modify any commonly-used phrases or automated messages, you can customize the translation text.

    1. Enter your new text in the text box below each phrase you would like to change.

    2. Scroll to the bottom of the page and click Save.

You can click Reset All on the Translations page if you would like to restore all language translations to default settings.

Modify Common and Automated Chat Phrases

Digital chat channels A way for contacts to interact with agents or bots. A channel can be voice, email, chat, social media, and so on. offer a number of commonly-used phrases and automated messages. Examples include Waiting for agent, You chatted with {name}, and There was a network error. Please try again. You may want to change the wording of these messages to better cater to your customer needs.

If your organization supports multiple languages, you can create a separate chat channel for each language. You can provide a chat widget in the appropriate language for each channel you create.

This option is available for chat messaging Asynchronous chat in which contacts send a chat message anytime and wait for a reply or live chat Agents and contacts interact on a real-time basis channels.

1. Click the app selector and select ACD.

2. Go to Digital > Points of Contact Digital.

3. Click Chat.

4. Click Translations for the channel you want to modify.

5. Click Edit next to the language you would like to make changes to.

6. For each phrase you want to change, enter your new text in the text box.

7. Click Save.

Configure File Type and Size Restrictions

You can configure restrictions for files that customers can send by chat to agents. Restricting file type requires that you know the MIME type for the file type you want to allow or restrict. This option is available for chat messaging Asynchronous chat in which contacts send a chat message anytime and wait for a reply or live chat Agents and contacts interact on a real-time basis channels.

Learn more about MIME types

MIME (Multi-purpose Internet Mail Extensions) type is a more secure method of determining file type than file extension. This is a 2-part identifier that specifies the general category and subtype for a file. For example, a PNG file has a MIME type of image/png. Web browsers and other applications can use MIME types to determine how to process a file or URL.

The MIME types for some common file types are listed in the following table. For a complete list, search the internet for IANA MIME types.

File Extension	MIME type
AAC	audio/aac
AVI	video/x-msvideo
BMP	image/bmo
DOC	application/msword
DOCX	application/vnd.openxmlformats-officedocument.wordprocessingml.document
HTM, HTML	text/html
JPG, JPEG	image/jpeg
MP3	audio/mpeg
MP4	audio/mp4
PDF	application/pdf
PNG	image/png
PPT	application/vnd.ms.powerpoint
PPTX	application/vnd.openxmlformats-officedocument.presentationml.presentation
XLS	application/vnd.ms.excel
XLSX	application/vnd.openxmlformats-officedocument.spreadsheetml.sheet

When a customer attempts to send a file that is too large or of a type that isn't allowed, a pop-up message appears. The message describes the allowed file types and size.

1. Click the app selector and select ACD.

2. Go to Digital > Points of Contact Digital.

3. Click Chat.

4. Click File Restriction for the channel you want to configure.

5. Enable attachments from customers to allow contacts to share file attachments in the chat. Click Save.

6. Enter the Maximum file size (in MB) that customers can send by chat. The default is 40 MB. This is the maximum value you can enter.

7. Click Save.

8. Under Allowed file types, enter the MIME type and Description for file types you want to allow.

   Learn more about fields in this step

   Field	Details
   MIME Type	Enter the MIME type for the files types you want to allow. If you want to permit all MIME types, enter an asterisk as a wildcard. If you want to permit all of a certain category of types, you can include the category with an asterisk. For example, to allow all image types, you would use image/*. Digital chat channels allow the following MIME types by default: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet application/pdf application/vnd.ms-excel video/* audio/* application/vnd.openxmlformats-officedocument.wordprocessingml.document application/vnd.ms-powerpoint image/* application/msword application/vnd.openxmlformats-officedocument.presentationml.present
   Description	A description of the file type. This appears in the pop-up message shown to customers who send files that are too large or of file types that aren't allowed. The description should correspond with the MIME type. For example, if the MIME type is application/msword, the Description should be .doc.

9. Click Add.

Block IP Addresses

At times you may need to block spammers or other inappropriate users from chatting with your organization. You might also want to prevent internal users from using the chat channel A way for contacts to interact with agents or bots. A channel can be voice, email, chat, social media, and so on. meant for your customers. You can block usage of a chat messaging Asynchronous chat in which contacts send a chat message anytime and wait for a reply or live chat Agents and contacts interact on a real-time basis channel by IP address.

1. Click the app selector and select ACD.

2. Go to Digital > Points of Contact Digital.

3. Click Chat.

4. Click IP Blocking for the channel you want to configure.

5. Enter each IP address on a separate line of the text area.

   View image

   

6. Click Save.

Configure Customer Authentication

You can configure enhanced customer authentication for chat messaging Asynchronous chat in which contacts send a chat message anytime and wait for a reply or live chat Agents and contacts interact on a real-time basis channels A way for contacts to interact with agents or bots. A channel can be voice, email, chat, social media, and so on.. This allows Digital Experience to authenticate a customer even if they use different devices over the course of a conversation. Customer authentication provides increased security for your organization's chat sessions.

For your chat messaging channels, once the customer is authenticated, Digital Experience downloads and displays any previous conversations between the agent and the customer. This provides a fully asynchronous chat experience.

Before you can enable customer authentication, you need to set up an OAuth server that has certain endpoints. The endpoints allow OAuth and Digital Experience to communicate. After you configure Digital Experience with the endpoints, you need to have your organization's website administrator modify the chat initialization script.

1. Click the app selector and select ACD.

2. Go to Digital > Points of Contact Digital.

3. Click Chat.

4. Click the OAuth option for the chat channel you want to configure.

5. Select Active OAuth flow and enter the URLs for the 3 required endpoints on the OAuth server you set up.
   View image

   

   Learn more about fields in this step

   Field	Details
   Endpoint authorize	Enter the URL for the Authorize endpoint. This endpoint exchanges the authorization code for the access and refresh tokens. The code can be used one time only and expires quickly (for example, in 1 minute).
   Endpoint refresh	Enter the URL for the Refresh Token endpoint. This endpoint generates a new access token. The access token's lifespan is approximately 30 minutes. This lets the contact stay signed into your app.
   Endpoint me	Enter the URL for the Me endpoint. This endpoint uses the access token to retrieve the customer's information, including past conversation with the agent. If you set up this functionality, you can map the user's details to custom fields. This lets you access the personal information elsewhere, for example, with welcome messages.

6. Enter the Client id and Client secret. These are identifiers from your auth provider.
7. Enter a Redirect uri if you want to redirect the contact to a specific page or view after they sign in.
8. Select the Request body format from the drop-down. This is the request format that CXone uses to get an auth token from your provider.
9. Click Save at the bottom of the page, or continue on to set up Data Mapping.

Data Mapping from Third-Party Authenticators

The steps in this section allow you to map the data from your third-party OAuth solution to your custom fields in Digital. Auth providers may not return user data in the same format. Therefore, you can map fields from the response with custom fields that Digital Experience can use. For example, a first name could be returned as Name, firstName, FirstAndLast, and so forth.

1. Click the app selector and select ACD.

2. Go to Digital > Points of Contact Digital.

3. Click Chat.

4. Click the OAuth option for the chat channel you want to configure.

5. Scroll to the Mapping section.
   View image

   
6. Select Enable custom mapping.
7. Enter the Customer id mapping field, Customer first name mapping field, and Customer last name mapping field.

   Hierarchical structures are not supported. Format your data simply. Use the following example as a guide.

   var(--codeSnippetCopyLabel)

   { 
    "customerId":"12345", 
    "customerFirstName": "John", 
    "customerLastName": "Doe"
   }

8. Select a Custom fieldfrom the drop-down to use with the mapping, then enter the field from the third-party authorization service that should correspond to the custom field. You can add up to 100 existing custom fields per mapping.

9. Click Save.

Add a JavaScript Command to the Webpage

Have your website administrator modify the chat initialization script on the webpage where customers initiate chats with your organization. The website administrator needs to add this command before the chat initialization code. Follow the example in the code below:

cxone('init', '1009');
                cxone('chat', 'setAuthorizationCode', 'your authorization code');
                cxone('chat', 'init', 1009, 'chat_0950394d-a403-4fe6-91d5-34e934771662');
            

Be sure to enter your brandId in the first line of the code. Enter your authorizationCode in the second line. Enter your brandId again, and your channelId in the third line.