Skip Navigation
Expand
Using Custom Fields in the Web Chat for Service widget
Answer ID 12816   |   Last Review Date 04/23/2024

How do I add a custom field to the chat pre-launch form?
 

Environment
Chat
Oracle B2C Service 23A and higher
Web Chat for Service component version 22.12 (minimum required version)
 
Resolution
You can add standard and custom fields to the pre-launch form for the end-user to complete these before starting the chat or you can prefill them with a value. The launch form fields are sent to chat server and you can use this information for routing purposes in your chat business rules or show these fields to the agent in his Browser UI interaction/incident workspace to give the agent the context of the chat. 
 
Step1: Create Custom fields in B2C Service
  • Make sure Chat Display is marked as checked, as shown below.
  • In the below example we have created 2 custom fields one of type Menu (contacttype) and another of type text (type)
Menu type custom field
 
Step2 : Add those Custom fields in Engagement Engine Web Chat Setting
  • Navigate to Engagement Engine → Settings → Web Chat → Open/create appropriate Web Chat component
  • Make sure you are using 23.12.1 version of Web Chat component (this version has the new component UI)
  • Navigate to section Functionality Configuration
  • Select pre launch form fields
  • By default you will get Subject, Email, First Name , Last Name in  pre launch fields.
  • In the pre launch form fields section you have option to add Pre Launch Form Field Data, as shown in the below image
Pre Launch Form Field Data
  • Select appropriate custom Field Type, in our example we took 2 custom fields (contacttype → menu and type → text)
  • In the Name field provide appropriate column name which is defined during custom field creation in B2C Service (see step1)
  • For custom field of type Menu (contacttype) we need to add options (list which needs to be visible in form) by clicking on options button of individual Form Field Data
  • This opens a section where we can add pre launch form field data options.  Click on to add list.  For multiple list add multiple field data options.
Note: List/options needs to be define in following format:
{"value": "id of the custom field", "text": "label customer should see"} or
{"value": "lookupName of the custom field", "text": "label customer should see"}
Example for contacttype menu we have added the following values:
{"value": "1", "text": "platinum"}
{"value": "2", "text": "gold"}
  • Once options are updated, define other values for form data and save it.
Step3 : Defining labels for Custom fields
  • All labels related to Web Chat are defined in custom strings.  You can access custom strings (I18n) from the Functionality Configuration Section.
Custom strings
  • Add new strings in below format: 
{nameofthecustomField}Label :"label needs to be displayed for customer"
 
for above mentioned custom fields we have  created following labels:
"contacttypeLabel": "Contact Type",
"typeLabel": "Issue Type",
Custom strings
  • Save and publish the Web Chat component.
  • Use the appropriate Web Chat component in your Rules to be reflected in the Web Chat client as shown below
WCFS