Prerequisites

Currently, this feature is applicable to agents only.

Before you integrate Webex Contact Center with the ServiceNow CRM console, ensure that you have the following:

Follow one of the two methods below:

For developer instances, we recommend following the steps under the developer instance guide.

If you own an enterprise-licensed instance, follow the guidelines for enterprise-licensed instances.

We do not recommend mixing the enterprise-licensed app with developer sandbox instances.

The following sections describe the steps to install the ServiceNow connector for developer instances.

1

Sign in to your ServiceNow developer portal account and open the Administration console.

2

From the My Instance area of the Account menu, click Start Building.

ServiceNow developer portal screenshot with ‘Start Building’ button highlighted.

3

On your developer instance, from the Filter navigator field at the upper left of the window, navigate to Plugins.

ServiceNow developer instance showing a search for ‘plugins’ filter navigator.

4

Search for the Openframe plugin that has the title Openframe. You may need to scroll through the list.

ServiceNow developer instance on the Applications screen, showing the search and results for ‘OpenFrame.’

5

Click Install to install the Openframe plugin.

6

In the Activate Plugin dialog box, click Activate.

ServiceNow developer instance showing OpenFrame plugin popup with the ‘Activate’ button highlighted.

7

When the plugin activation is completed, click Close & Reload Form in the Plugin Activation dialog box.

ServiceNow developer instance showing OpenFrame plugin activation loading.

ServiceNow developer instance showing OpenFrame plugin activation success window with the ‘Close & Reload Form’ button highlighted.

8

To verify the plugin activation, from the Filter navigator field at the upper left of the window, navigate to OpenFrame.

9

Click Configurations and ensure that the OpenFrame plugin appears in the OpenFrame Configurations list.

ServiceNow developer instance showing OpenFrame Configurations in the filter navigator search.

1

Download the latest System Update Set XML file available on the github repo at this location : https://github.com/CiscoDevNet/webex-contact-center-crm-integrations/tree/main/ServiceNow.

File Name: webexcc-servicenow-update-setV(X).xml

Github repo screenshot for Webex Contact Center CRM integrations – ServiceNow.

2

On your ServiceNow instance, from the Filter navigator field at the upper left of the window, navigate to System Update Sets > Update Sets to Commit.

ServiceNow developer instance showing a search in the filter navigator on the ‘All’ tab for ‘Update set’ and ‘Update Sets to Commit’ option highlighted.

3

Click the Import Update Set from XML link.

ServiceNow developer instance on the Update Sets results page with ‘Related Links: Import Update Set from XML’ highlighted.

4

Click Choose File, select the System Update Set XML file, and then click Upload.

ServiceNow developer instance import XML screen.

ServiceNow developer portal retrieved update sets list.

The update set appears in the Retrieved Update Sets list and is in the Loaded state.
5

From the Retrieved Update Sets list, click the Update Set File Name (link) to open the Update Set.

ServiceNow developer portal retrieved update sets list for an updated file.

6

At the upper right of the window, click Preview Update Set to check the update set for issues.

ServiceNow developer portal retrieved update sets list for an updated file with the ‘Preview Update Set’ button highlighted.

7

Click Close on the Update Set Preview dialog box once preview is completed.

ServiceNow developer portal with the update set preview success notification.

8

Click Commit Update Set.

ServiceNow developer portal retrieved update sets list for an updated file with the ‘Commit Update Set’ button highlighted.

9

Click Close on the Update Set Commit dialog box once committing of Update Set is completed.

ServiceNow developer portal with the update set commit success notification.

1

In the Filter navigator field at the upper left of the window, type sys_properties.list and press enter.

ServiceNow developer instance showing a search in the filter navigator on the ‘All’ tab for ‘sys_properties.list’

2

On the System Properties page, sort the properties by updated date. Ensure that you can see the following Webex Contact Center properties:

ServiceNow developer instance system properties page.

3

Click agentdesktop_url to open the System Property agentdesktop_url page.

4

In the Value field, enter the URL for the Webex Contact Center Desktop according to the region of operation.

ServiceNow developer instance system property details for agentdesktop_url.

5

Click Update to save the changes.

6

(Optional) To change the Activity table name, edit the webexccactivitytable properties as required.

On the System Properties page, click on webexccactivitytable.

Change the Value field as required.

ServiceNow developer instance system property details for webexactivitytable.

7

(Optional) Add User Groups in the following ways:

  1. In the Filter navigator field at the upper left of the window, navigate to Groups under System Security.

    ServiceNow developer instance filter navigator search for ‘Groups’ under ‘System Security’
  2. Create a new user group or use an existing one.

    ServiceNow developer instance group page for WebexccAgentsGroup.

  3. Click Edit.

  4. Search for sn_openframe_user under Collection and move it to your user group.

    ServiceNow developer instance group edit members page showing a search for a collection.

    ServiceNow developer instance group edit members page showing a collection moved into the roles list.

  5. Click Save.

  6. Add the user as a group member.

    ServiceNow developer instance group page with user roles assigned.

1

From the Filter navigator field, navigate to OpenFrame > Configurations.

ServiceNow developer instance filters navigator with ‘openframe’ in the search field and ‘Configurations’ under ‘OpenFrame’ highlighted in the results.

2

Click New.

ServiceNow developer instance OpenFrame Configurations page with ‘New’ highlighted.

3

Enter the following properties for the URL:

  • Name: Webex Contact Center Desktop

  • Title: Webex Contact Center

  • Width: 550 (Recommended)

  • Height: 600 (Recommended)

4

To the right of the URL field, click the Lock button and add agentdesktop.do as the URL. (Do this step to point configuration to the UI Page)

ServiceNow developer instance OpenFrame Configurations – New Record page with the lock icon highlighted.

5

(Optional) Select the User / Agent Group(s) to assign the configuration.

ServiceNow developer instance OpenFrame Configurations – New Record user group selection.

6

Click Submit. The URL appears as a link.

ServiceNow developer instance OpenFrame Configurations – New Record page showing the URL link that appears after submitting the user group selections.

7

Before you attempt to use the OpenFrame phone, ensure that you upload the ServiceNow custom Desktop Layout JSON file to the Webex Contact Center Management Portal. For more information, see Set Up the ServiceNow Desktop Layout on Webex Contact Center.

1

Download the Desktop layout for ServiceNow from https://github.com/CiscoDevNet/webex-contact-center-crm-integrations/tree/main/ServiceNow.

Github screen for Webex Contact Center CRM Integrations – Desktop Layouts – ServiceNow.

2

Update the properties in the Desktop Layout file, if required.

3

Go to the Webex Contact Center Management Portal.

4

From the Management Portal navigation bar, choose Provisioning > Desktop Layout.

Webex Contact Center Management Portal provisioning page with Desktop Layout highlighted in the left navigation.

5

Click New Layout and enter the details for the desktop layout.

6

Upload the ServiceNow Desktop Layout JSON file.

7

Click Save to save the configuration.

You can now start the Webex Contact Center Desktop within the ServiceNow console.

8

From the Filter navigator field, navigate to Service Operations Workspace.

ServiceNow home page with Webex Contact Center Agent Desktop integrated with ServiceNow.

The following sections describe the steps to install the ServiceNow connector for licensed enterprise instances.

1

Sign in to your ServiceNow developer portal account and open the Administration console.

2

From the My Instance area of the Account menu, click Start Building.

ServiceNow developer portal screenshot with ‘Start Building’ button highlighted.

3

On your developer instance, from the Filter navigator field at the upper left of the window, navigate to Plugins.

ServiceNow developer instance showing a search for ‘plugins’ filter navigator.

4

Search for the Openframe plugin that has the title Openframe. You may need to scroll through the list.

ServiceNow developer instance on the Applications screen, showing the search and results for ‘OpenFrame.’

5

Click Install to install the Openframe plugin.

6

In the Activate Plugin dialog box, click Activate.

ServiceNow developer instance showing OpenFrame plugin popup with the ‘Activate’ button highlighted.

7

When the plugin activation is completed, click Close & Reload Form in the Plugin Activation dialog box.

ServiceNow developer instance showing OpenFrame plugin activation loading.

ServiceNow developer instance showing OpenFrame plugin activation success window with the ‘Close & Reload Form’ button highlighted.

8

To verify the plugin activation, from the Filter navigator field at the upper left of the window, navigate to OpenFrame.

9

Click Configurations and ensure that the OpenFrame plugin appears in the OpenFrame Configurations list.

ServiceNow developer instance showing OpenFrame Configurations in the filter navigator search.

1

In the Filter navigator field at the upper left of the window, enter sys_properties.list.

ServiceNow developer instance showing a search in the filter navigator on the ‘All’ tab for ‘sys_properties.list’

2

On the System Properties page, sort the properties by updated date. Ensure that you can see the following Webex Contact Center properties:

ServiceNow developer instance system properties page results.

3

Click agentdesktop_url to open the System Property agentdesktop_url page.

4

In the Value field, enter the URL for the Webex Contact Center Desktop according to the region of operation.

ServiceNow developer instance system property details page for agentdesktop_url.

5

Click Update to save the changes.

6

(Optional) To change the Activity table name, edit the x_caci_webexcc.webexccactivitytable properties as required.

  1. On the System Properties page, click on x_caci_webexcc.webexccactivitytable.

    ServiceNow developer instance system properties page results for x_caci_webexcc.webexccactivitytable.

  2. Change the Value field as required.

    ServiceNow developer instance system property page for x_caci_webexcc.webexccactivitytable.

7

(Optional) Add User Groups in the following ways:

  1. In the Filter navigator field at the upper left of the window, navigate to Groups under System Security.

    ServiceNow developer instance filter navigator results for ‘Groups.’

    SeviceNow developer instance group page for webexccagentsgroup.

  2. Click Edit and add the following roles:

    • sn_openframe_user

    • x_caci_webexcc.agent

    • agent_workspace_user

    • x_caci_webexcc.webexcc_imp_activity_user

    • x_caci_webexcc.webex_contact_center

    SeviceNow developer instance group page for webexccagentsgroup with rolls added.

1

From the Filter navigator field, navigate to OpenFrame > Configurations.

ServiceNow developer instance filters navigator with ‘openframe’ in the search field and ‘Configurations’ under ‘OpenFrame’ highlighted in the results.

2

Click New.

ServiceNow developer instance OpenFrame Configurations page with ‘New’ highlighted.

3

Enter the following properties for the URL:

  • Name: Webex Contact Center Desktop

  • Title: Webex Contact Center

  • Width: 550 (Recommended)

  • Height: 600 (Recommended)

4

To the right of the URL field, click the Lock button and add x_caci_webexcc_agentdesktop.do as the URL. (Do this step to point configuration to the UI Page)

ServiceNow developer instance OpenFrame Configurations – New Record page with the lock icon highlighted.

5

(Optional) Select the User / Agent Group(s) to assign the configuration.

ServiceNow developer instance OpenFrame Configurations – New Record user group selection.

6

Click Submit. The URL appears as a link.

ServiceNow developer instance OpenFrame Configurations – New Record with URL added.

7

From the Filter navigator field, navigate to Service Operations Workspace.

ServiceNow home page with Webex Contact Center Agent Desktop integrated with ServiceNow.

8

(Optional) In the User Group list, move the user groups that can access the Webex Contact Center Desktop from Available to Selected.

9

Before you attempt to use the OpenFrame phone, ensure that you upload the ServiceNow custom Desktop Layout JSON file to the Webex Contact Center Management Portal. For more information, see Set Up the ServiceNow Desktop Layout on Webex Contact Center.

1

Download the Desktop layout for ServiceNow from https://github.com/CiscoDevNet/webex-contact-center-crm-integrations/tree/main/ServiceNow.

Github screen for Webex Contact Center CRM Integrations – Desktop Layouts – ServiceNow.

2

Update the properties in the Desktop Layout file, if required.

3

Go to the Webex Contact Center Management Portal.

4

From the Management Portal navigation bar, choose Provisioning > Desktop Layout.

Webex Contact Center Management Portal provisioning page with Desktop Layout highlighted in the left navigation.

5

Click New Layout and enter the details for the desktop layout.

6

Upload the ServiceNow Desktop Layout JSON file.

7

Click Save to save the configuration.

You can now start the Webex Contact Center Desktop within the ServiceNow console.

8

From the Filter navigator field, navigate to Service Operations Workspace.

ServiceNow home page with Webex Contact Center Agent Desktop integrated with ServiceNow.

1

From the Filter navigator field, navigate to Incidents > Open Incident.

2

Right click on the caller field and click Configure Dictionary.

ServiceNow developer instance Incidents window with the Configure Directory option highlighted.

3

Add comma separated Attributes “ref_contributions=show_phone,.

ServiceNow developer instance call incident window for a Directory Entry.

You can now start using the Webex Contact Center Desktop within the ServiceNow console.

4

From the Filter navigator field, navigate to Service Operations Workspace.

ServiceNow home page with Webex Contact Center Agent Desktop integrated with ServiceNow.

We support signing into Agent Desktop using WebRTC for Salesforce (SFDC) and Microsoft Dynamics (MS Dynamics) Connectors only.

Agent Desktop in the ServiceNow Console

Before you make outdial calls, ensure that you do the following:

  • Create the outdial entry point and set up an outdial entry point strategy.

  • Enable outdial ANI for the Agent Profile.

  • Set the outdial ANI to a Dial Number-to-Entry Point mapping.

For more information, see the Provisioning chapter of the Cisco Webex Contact Center Setup and Administration Guide.

From the Filter navigator field, navigate to Service Operations Workspace.

ServiceNow home page with Webex Contact Center Agent Desktop integrated with ServiceNow.

For information on how to use Desktop, see the Agent tab in the Webex Contact Center help.

Overview

This article covers several ways to customize your business rules for the ServiceNow CRM connector. It details how you can customize the use cases based on business rules that are specific to ServiceNow.

The customer must self manage these use cases on ServiceNow. The configuration is specific to ServiceNow and not Webex Contact Center software or expertise.

This is a reference documentation to aid the modification of business rules. The ServiceNow developers will create and manage the business rules, and provide support.

Cisco only provides sample documentation.

The following sections provide details about how to set up, enable, and manage Actions widget for developer and enterprise instances.

Commit the Update Set for Actions Widget

For the licensed enterprise instances, install the latest Webex Contact Center app from the ServiceNow store.

To set up the Actions widget for the developer instances, download the latest System Update Set XML file available on the github repo at this location: https://github.com/CiscoDevNet/webex-contact-center-crm-integrations/tree/main/ServiceNow/ActionsWidget. The file name is webexcc-servicenow-update-setv7-1-ActionsWidget.xml. To commit the update set for the Actions widget, see steps 2 to 9 in Commit the Update Set.

Enable Actions Widget

Use the isWidgetDisplayEnabled property to enable the Actions widget. You must not modify this property's value in the custom desktop layout's headless section. The property is always set to false in the custom desktop layout's headless section. You should update the property's value only in the panel section of the custom desktop layout.

Once you enable the Actions widget in the custom desktop layout, you can perform the following actions:

  • Manage activity records—Click View/Edit Activity Record to view the list of activity records associated with the caller.
  • Associate CRM objects—Click Associate to activity records to add CRM objects such as call type (inbound or outbound), call object, call notes, and so on to the activity record.
  • Manage incidents—Click Create Incident. A new incident is created with the caller details prepopulated. You can make the required updates to the incident. You can choose to modify the record type from incident to case, HR module, and so on based on your requirements. To change the record type, modify the value of the typeOfRecord property in the Actions widget configuration. For example:
    {
                  "comp": "md-tab-panel",
                  "attributes": { "slot": "panel", "class": "widget-pane" },
                  "children": [
                    {
                      "comp": "agentx-custom-desktop",
                      "script": "https://cx-crmconnector.ciscoccservice.com/servicenow/v5/dist/index.js",
                      "properties": {
                        "isWidgetDisplayEnabled": true,
                        "typeOfRecord" : "Create Incident" 
                      },
                      "wrapper": {
                        "title": "SNOW Actions !",
                        "maximizeAreaName": "app-maximize-area"
                      }
                    }
                  ]
                }
  • Add live call notes—You can capture additional information about the call in the text area and wrap-up the call. You can see these notes added as call notes in the activity record.

Code change on ServiceNow

The Script Includes changes
  1. Go to filter navigator and search for script includes.

    Select the Script Includes under System UI.

  2. Filter the Name and search for propUtils.

  3. Change the method UserGetSysId in the Script.

    Curent:

    UserGetSysId : function () {
    var opened_for;
    var user = new GlideRecord("sys_user");
    user.addQuery(this.getParameter('field'),this.getParameter('value'));
    user.query();
    if (user.next())
    opened_for=user.sys_id;
    var grInt = new GlideRecord('interaction');
    grInt.initialize();
    grInt.assigned_to= gs.getUserID();
    grInt.type= 'phone';
    grInt.opened_for= opened_for;
    var sysid=grInt.insert();
    return sysid;
    },

    New sample code for the incident:

    UserGetSysId : function () {
                var opened_for;
    
            //Incident related changes
                 var sysidlist = {};
                var user = new GlideRecordSecure("sys_user");
                  user.addQuery(this.getParameter('field'),this.getParameter('value'));
                  user.query();
                  if(user.next()) {
                     opened_for=user.sys_id;//return user.sys_id;
                        var inc = new GlideRecordSecure('incident');
                                inc.addQuery('caller_id', opened_for);
                                inc.addQuery('state','IN','1,2');
                                inc.orderByDesc('sys_created_on');
                                inc.query();
                                    if (inc.next()) {
                                        sysidlist.incsysid=inc.getUniqueValue();
                                   }else{
                                        inc.initialize();
                                        inc.caller_id=opened_for;
                                        inc.contact_type='phone';
                                        inc.short_description='Call Received From '+ this.getParameter('value');
                                        sysidlist.incsysid=inc.insert();
                                    }
                  } 
                var grInt = new GlideRecordSecure('interaction');
                    grInt.initialize(); 
                    grInt.assigned_to= gs.getUserID(); 
                    grInt.type= 'phone'; 
                    grInt.opened_for= opened_for; 
                var sysid=grInt.insert();
                sysidlist.sysid=sysid;
                
                return JSON.stringify(sysidlist);
            },

Method change on UI pages
  1. Go to filter navigator and search for UI page.

    Select UI pages under System UI.

  2. Filter the Name and search for agentdesktop.

  3. Change the screenpop function in Client script.

    Current function:

    // screen pop
    function screenpop(callerani,callSessionInfo) {
    
    
    
    if(callerani===callSessionInfo.phoneNumber){
    callerani=stripPrefixes(callerani);
    }
    var gaout = new GlideAjax('propUtils');
    gaout.addParam('sysparm_name', 'UserGetSysId');
    gaout.addParam('field', 'phone');
    gaout.addParam('value', callerani);
    gaout.getXMLWait();
    
    
    var sysid = gaout.getAnswer();
      
    openFrameAPI.openServiceNowForm({
    entity: 'interaction',
    query: 'sys_id='+sysid
    });

    Sample code for the incident:

    // screen pop
    function screenpop(callerani,callSessionInfo) {
       
    
        if(callerani===callSessionInfo.phoneNumber){
            callerani=stripPrefixes(callerani);
        }
        
        var gaout = new GlideAjax('propUtils');
            gaout.addParam('sysparm_name', 'UserGetSysId');
            gaout.addParam('field', 'phone');
            gaout.addParam('value', callerani);
            gaout.getXMLWait();
    
    // For Incident-related change
          var sysObj = JSON.parse(gaout.getAnswer());
        
        if(sysObj.incsysid){
            openFrameAPI.openServiceNowForm({
            entity: 'incident',
            query: 'sys_id='+sysObj.incsysid, 
            'interaction_sys_id': sysObj.sysid  
           });
        }else{
            openFrameAPI.openServiceNowForm({
            entity: 'incident',
            query: 'sys_id=-1',
            'interaction_sys_id': sysObj.sysid //'a2ba0ba62fd121106446cc96f699b6b8'  
           });
        }
       
    }

If the caller information exists in CRM, and there is already a new incident opened with this contact, application opens the inprogress incident

If the caller information does not exist in CRM, the application opens a new incident

If the caller information exists in CRM, the application opens a new incident with prefilled details

Overview

This use case details the process to add an extra column to the ServiceNow table - webexcc_imp_activity and create sn_openframe_phone_log upon the installation of the Webex CC for ServiceNow CRM Connector.

By default, the table contains certain out of the box system fields and values.

You can create more business-specific variables (CAD Variables) inside of the WebexCC Flow designer and add the CAD variables inside of the ServiceNow post call activity log, as well as persist this to the post call activity table data.

This is a reference documentation only - and shows how to do this for a sample CAD variable called Customer Name that stores the customer name inside the IVR and posts this to ServiceNow.

It is expected that the partner+customer ServiceNow developers will configure and manage this configuration as it is a customization to the existing connector.

Cisco only provides the techniques on how to customize and extend the connector.

As of this article, the Cisco team has validated support for the addition of CAD variable to the Activity Log and Activity Table using the technique described below:

Add Column to WebexCC IMP Activity

  1. Edit the table in the developer version of ServiceNow.

    ServiceNow developer instance WebexCC IMP activity table.

  2. Go to the filter navigator and search for studio.

    ServiceNow developer instance filter navigator on the All tab with ‘studio’ entered in the filter.

    Select Webex Contact Center

    Studio app for ServiceNow with the Select Application window open.

    or

    Studio app for ServiceNow with the Select Application window open and ‘Select Store App to Customize’ selected.

    Studio app for ServiceNow with the ‘Select Store App to Customize’ window open and ‘Webex Contact Center’ selected.

    Studio app for ServiceNow with Webex Contact Center application file details.

  3. Select the WebexCC IMP Activity table

    Studio app for ServiceNow WebexCC IMP Activity table.

  4. Add a new column, for example, CustomerName

    Studio app for ServiceNow WebexCC IMP Activity table new column example.

    Studio app for ServiceNow WebexCC IMP Activity table new column example with new column added.

Add Column to Phone Log

  1. Edit the phone log table.

    ServiceNow developer instance search for a phone log table.

    ServiceNow developer instance phone log table.

  2. Add a new column, for example, CustomerName.

    ServiceNow developer instance phone log table new column examples.

    ServiceNow developer instance phone log table new column example with new column added.

WebexCC Activity Transform Map

Studio app for ServiceNow WebexCC Activity Transform Map.

Add a new column, for example, CustomerName field mapping.

Studio app for ServiceNow WebexCC Activity Transform Map new column example for CustomerName field mapping.

Studio app for ServiceNow WebexCC Activity Transform Map new column example with CustomeName selected in the Target field.

Personalize List Columns

Studio app for ServiceNow WebexCC Activity Transform Map with popup window to personalized list columns. Choice action option is highlighted in the Selected column.

As Service Now recommends, change the Choice action from create to ignore.

Studio app for ServiceNow WebexCC Activity Transform Map with the Choice action column, showing the dropdown to choose ‘ignore’ or ‘create.’

Studio app for ServiceNow WebexCC Activity Transform Map with the Choice action column and ‘ignore’ highlighted for the customer name source field.

Configure phone logs list

Studio app for ServiceNow configuring phone log list with CustomerName highlighted in the Selected column.

Go to Script Include

Add only one line webexcc.u_customername=actInfo.CustomerName to propUtils.

ServiceNow developer instance filter navigator search for ‘script includes.’

ServiceNow developer instance Script Includes page.

Sample script

See the line: webexcc.u_customername=actInfo.CustomerName; with a supporting comment.

var propUtils = Class.create();
propUtils.prototype = Object.extendsObject(global.AbstractAjaxProcessor,{
         getWebexccProp : function () {
           var webexccprop = {};
           webexccprop.instanceurl= 'https://'+gs.getProperty('instance_name')+'.service-now.com/';
           webexccprop.url=gs.getProperty('x_caci_webexcc.agentdesktop_url');
          // webexccprop.popupurl=gs.getProperty('x_caci_webexcc.screenpop_url');
           return  JSON.stringify(webexccprop);
      
        },
        UserGetSysId : function () {
            var opened_for;
            var user = new GlideRecord("sys_user");
              user.addQuery(this.getParameter('field'),this.getParameter('value'));
              user.query();
              if (user.next())
                 opened_for=user.sys_id;//return user.sys_id;
//            else
//               return null;
            var grInt = new GlideRecord('interaction');
                grInt.initialize();
                grInt.assigned_to= gs.getUserID();
                grInt.type= 'phone';
                grInt.opened_for= opened_for;
            var sysid=grInt.insert();
            return sysid;
        },
        setWebexcctable : function () {
            var sys_id=0;
             
            var actInfo = JSON.parse(this.getParameter('actInfo'));
            var webexcc = new GlideRecordSecure(gs.getProperty('x_caci_webexcc.webexccactivitytable'));
            webexcc.addQuery("callobject", actInfo.CallObject);
            webexcc.query();
            if(!webexcc.next()) {
                webexcc.ani = actInfo.ani;
                webexcc.dnis =actInfo.dnis;
                webexcc.queuename =actInfo.queuename;
                webexcc.wrapuptime =actInfo.wrapuptime;
                webexcc.callduration =actInfo.CallDurationInSeconds;
                webexcc.ringingtime =actInfo.ringingtime;
                webexcc.activitydate =actInfo.ActivityDate;
                webexcc.callobject =actInfo.CallObject;
                webexcc.calltype =actInfo.CallType;
                webexcc.calldisposition=actInfo.CallDisposition;
                 
                // This line is Added - to capture it in the Activity Log
               webexcc.u_customername=actInfo.CustomerName;
                 
                sys_id=webexcc.insert();
 
                //Activities on Incident record;
                var actInfoString =this.getParameter('actInfo');
                var suser = new GlideRecordSecure("sys_user");
                    suser.addQuery("phone", this.getParameter('ani'));
                    suser.query();
                    if(suser.next()) {
                    var inc = new GlideRecordSecure('incident');
                            inc.addQuery('caller_id', suser.sys_id);
                            inc.orderByDesc('sys_created_on');
                            inc.query();
                                if (inc.next()) {
                                    var jsonPretty = JSON.stringify(JSON.parse(actInfoString),null,2); 
                                    inc.comments =jsonPretty;
                                inc.update();
     
                            }
                    }
            }  
            return sys_id;
       },
 
    type: 'propUtils'
});

Create a CAD variable in Flow designer

Webex Contact Center CAD variable flow designer with Add Flow Variable popup for CustomerName.

Add the CAD variable to the Desktop Layout

Example

"CadName1:SnowField1,CadName2:SnowField2"
 CadName1 is CustomerName
 SnowField1 is also used as CustomerName which is part of sample scirpt showen above "actInfo.CustomerName".

Example source code for adding the CAD variable to the Desktop Layout.

Demo screenshots

View the newly added CAD variable in the WebexCC Activity table.

ServiceNow example of the newly added CAD variable in the WebexCC Activity table, showing ‘Customer Name’ in the Cisco WebexCC popup.

ServiceNow example of the newly added CAD variable in the WebexCC Activity table, showing ‘CustomerName’ in the comments section under ‘Activity’ and ‘System Administrator.’

ServiceNow developer instance example of the newly added CAD variable in the WebexCC Activity table, showing the ‘CustomerName’ column.

Create CAD variable for Flow Designer

Incident urgency

Webex Contact Center flow designer create CAD variable screen showing the edit flow variable popup for an incident urgency flow variable.

Incident impact

Webex Contact Center flow designer create CAD variable screen showing the edit flow variable popup for an incident urgency flow variable.

Service Now script update

Updates to the Script Includes

  1. Go to the filter navigator and search for script includes

    Select the Script Includes option under System UI.

    ServiceNow developer instance filter navigator search for ‘script includes’

  2. Filter the Name with propUtils.

    ServiceNow developer instance Script Includes name filter by ‘propUtils’

  3. Change the method UserGetSysId in the Script field.

    ServiceNow developer instance Script Includes – propUtils details page.

    Current script:

    UserGetSysId : function () {
    var opened_for;
    var user = new GlideRecord("sys_user");
    user.addQuery(this.getParameter('field'),this.getParameter('value'));
    user.query();
    if (user.next())
    opened_for=user.sys_id;
    var grInt = new GlideRecord('interaction');
    grInt.initialize();
    grInt.assigned_to= gs.getUserID();
    grInt.type= 'phone';
    grInt.opened_for= opened_for;
    var sysid=grInt.insert();
    return sysid;
    },

    New sample code for the incident:

    UserGetSysId : function () {
                var opened_for;
                
                var sysidlist = {};
                var user = new GlideRecordSecure("sys_user");
                  user.addQuery(this.getParameter('field'),this.getParameter('value'));
                  user.query();
                  if(user.next()) {
                     opened_for=user.sys_id;//return user.sys_id;
                        var inc = new GlideRecordSecure('incident');
                                inc.addQuery('caller_id', opened_for);
                                inc.addQuery('state','IN','1,2');
                                inc.orderByDesc('sys_created_on');
                                inc.query();
                                    if (inc.next()) {
                                        sysidlist.incsysid=inc.getUniqueValue();
                                   }else{
                                        inc.initialize();
                                        inc.caller_id=opened_for;
                                        inc.contact_type='phone';
                                        inc.urgency=this.getParameter('IncUrgency');
                                        inc.impact=this.getParameter('Impact');
                                        inc.short_description='Call Received From '+ this.getParameter('value');
                                        sysidlist.incsysid=inc.insert();
                                    }
                  } 
                var grInt = new GlideRecordSecure('interaction');
                    grInt.initialize(); 
                    grInt.assigned_to= gs.getUserID(); 
                    grInt.type= 'phone'; 
                    grInt.opened_for= opened_for; 
                var sysid=grInt.insert();
                sysidlist.sysid=sysid;
                
                return JSON.stringify(sysidlist);//sysid;
            },

A method change on UI pages
  1. Go to the filter navigator and search for UI pages.

    Select the UI Pages option under System UI.

    ServiceNow developer instance filter navigator search for ‘Ui page’

  2. Filter the UI Pages with Name and search for agentdesktop.

    ServiceNow developer instance UI Pages name filter to search ‘agentdesktop’

  3. Change the screenpop function in the script field.

    ServiceNow developer instance UI Page – agentdesktop details page.

    Current function:

    // screen pop
    function screenpop(callerani,callSessionInfo) {
    
    
    if(callerani===callSessionInfo.phoneNumber){
    callerani=stripPrefixes(callerani);
    }
    var gaout = new GlideAjax('propUtils');
    gaout.addParam('sysparm_name', 'UserGetSysId');
    gaout.addParam('field', 'phone');
    gaout.addParam('value', callerani);
    gaout.getXMLWait();
    
    
    var sysid = gaout.getAnswer();
      
    openFrameAPI.openServiceNowForm({
    entity: 'interaction',
    query: 'sys_id='+sysid
    });
    
    }

    Sample code for the incident:

    // screen pop
    function screenpop(callerani,callSessionInfo) {
       
        var Impact=3;
        if(callSessionInfo.callAssociatedData.Impact != null && callSessionInfo.callAssociatedData.Impact != undefined)
        {
            Impact=callSessionInfo.callAssociatedData.Impact.value;
        }
        var IncUrgency=3;
        if(callSessionInfo.callAssociatedData.Urgency != null && callSessionInfo.callAssociatedData.Urgency != undefined)
        {
            IncUrgency=callSessionInfo.callAssociatedData.Urgency.value;
        }
        if(callerani===callSessionInfo.phoneNumber){
            callerani=stripPrefixes(callerani);
        }
        
        var gaout = new GlideAjax('propUtils');
            gaout.addParam('sysparm_name', 'UserGetSysId');
            gaout.addParam('field', 'phone');
            gaout.addParam('value', callerani);
            gaout.addParam('IncUrgency', IncUrgency);
            gaout.addParam('Impact', Impact);
            gaout.getXMLWait();
          // var sysid = gaout.getAnswer();
          var sysObj = JSON.parse(gaout.getAnswer());
        
        if(sysObj.incsysid){
            openFrameAPI.openServiceNowForm({
            entity: 'incident',
            query: 'sys_id='+sysObj.incsysid, 
            'interaction_sys_id': sysObj.sysid  
           });
        }else{
            openFrameAPI.openServiceNowForm({
            entity: 'incident',
            query: 'sys_id=-1',
            'interaction_sys_id': sysObj.sysid  
           });
        }
        window.localStorage.setItem("screenpopinteraction",JSON.stringify(sysObj));
       
    }

If the caller information exists in CRM, and there is no new or inprogress incident then the application opens a new incident

ServiceNow example of an incident.

ServiceNow example of an interaction.

Change the code on ServiceNow

Add new columns to the WebexCC IMP Activity table

Open the WebexCC IMP Activity table

ServiceNow developer instance WebexCC Activity TransformMap.

ServiceNow developer instance WebexCC Activity TransformMap details page.

Add a new column - InteractionsNumber

ServiceNow developer instance WebexCC Activity TransformMap new column, InteractionNumber.

ServiceNow developer instance WebexCC Activity TransformMap details page showing the new ‘interactionnumber’ column added.

Add a new column - IncidentNumber

ServiceNow developer instance WebexCC Activity TransformMap details page showing adding a new ‘incidentnumber’ column.

Click on Update.

ServiceNow developer instance WebexCC Activity TransformMap details page showing editing the max length for the IncidentNumber column.

ServiceNow developer instance WebexCC Activity TransformMap details page showing the new ‘incidentnumber’ column added.

Add new columns to the Phone Log table

Open the Phone Log table

ServiceNow developer instance Phone Log table.

Add a new column - InteractionsNumber

ServiceNow developer instance Directory Entry – New Record page showing a new column for InteractionsNumber.

ServiceNow Developer instance Phone Log table with InteractionsNumber column added.

Add a new column - IncidentNumber

ServiceNow developer instance Directory Entry – New Record page showing a new column for IncidentNumber.

ServiceNow Developer instance Phone Log table with IncidentNumber column added.

WebexCC Activity Transform Map

Open transform map from the filter navigator

ServiceNow developer instance filter navigator search for ‘transform map’

ServiceNow developer instance Table Transform Maps showing WebexCC Activity TransformMap in results.

Click on WebexCC Activity TransformMap

ServiceNow developer instance WebexCC Activity TransformMap.

Add new - for Interaction Number Map

ServiceNow developer instance WebexCC Activity TransformMap with ‘InteractionNumber’ entered into the ‘Target field’

ServiceNow developer instance WebexCC Activity TransformMap with ‘InteractionNumber’ added.

Add new - for Incident Number Map

ServiceNow developer instance WebexCC Activity TransformMap with ‘IncidentNumber’ entered into the ‘Target field’

Click Update.

ServiceNow developer instance WebexCC Activity TransformMap with ‘IncidentNumber’ added.

Changes to Script Includes

  1. Go to filter navigator and search for "script includes".

    Select the Script Includes under System UI.

    ServiceNow developer instance filter navigator with search for ‘script includes’

  2. Filter the Name with propUtils.

    ServiceNow developer instance Script Includes with Name filter applied to search and  ‘propUtils’ entered into the search field.

  3. Change the method setWebexcctable.

    ServiceNow developer instance Script includes - propUtils page

    New sample code for Incident:

    setWebexcctable : function () {
                var sys_id=0;
                
                var actInfo = JSON.parse(this.getParameter('actInfo'));
                var webexcc = new GlideRecordSecure(gs.getProperty('webexccactivitytable'));
                webexcc.addQuery("u_callobject", actInfo.CallObject);
                webexcc.query();
                if(!webexcc.next()) {
                    
                    //Activities on Incident record;
                    //var actInfoString =this.getParameter('actInfo');
                    var incsysid=actInfo.incident_sys_id;
                    var interactionsysid=actInfo.interaction_sys_id;
                    var incnum="";
                    var intenum="";
                    delete actInfo['interaction_sys_id'];
                    delete actInfo['incident_sys_id'];
                    if( interactionsysid!= null && interactionsysid != undefined){
                        var inte = new GlideRecordSecure('interaction');
                        //inte.get('sys_id', interactionsysid );
                        
                        inte.addQuery('sys_id', interactionsysid );
                        inte.query();
                        if (inte.next()) {
                            intenum=inte.number;
                           // inte.setValue('state','Closed Complete');
                            inte.work_notes='Update State to closed.';
                            inte.update();
        
                        }
                    }
                    if( incsysid!= null && incsysid != undefined){
                        var inci = new GlideRecordSecure('incident');
                        inci.addQuery('sys_id', incsysid );
                        inci.query();
                        if (inci.next()) {
                            incnum=inci.number;
                            var jsonPretty = JSON.stringify(actInfo,null,2); //JSON.stringify(JSON.parse(actInfoString),null,2);  
                            inci.comments =jsonPretty;
                            inci.update();
        
                        }
                    }else{
                      var suser = new GlideRecordSecure("sys_user");
                        suser.addQuery("phone", this.getParameter('ani'));
                        suser.query();
                        if(suser.next()) {
                        var inc = new GlideRecordSecure('incident');
                                inc.addQuery('caller_id', suser.sys_id);
                                inc.addQuery('state','IN','1,2');
                                inc.orderByDesc('sys_created_on');
                                inc.query();
                                    if (inc.next()) {
                                        var jsonPretty = JSON.stringify(actInfo,null,2);  
                                        inc.comments =jsonPretty;
                                    inc.update();
        
                                }
                        } 
                    }
                   
                    
                    webexcc.u_ani = actInfo.ani;
                    webexcc.u_dnis =actInfo.dnis;
                    webexcc.u_queuename =actInfo.queuename;
                    webexcc.u_wrapuptime =actInfo.wrapuptime;
                    webexcc.u_callduration =actInfo.CallDurationInSeconds;
                    webexcc.u_ringingtime =actInfo.ringingtime;
                    webexcc.u_activitydate =actInfo.ActivityDate;
                    webexcc.u_callobject =actInfo.CallObject;
                    webexcc.u_calltype =actInfo.CallType;
                    webexcc.u_calldisposition=actInfo.CallDisposition;
                    webexcc.u_incidentnumber=incnum;
                    webexcc.u_interactionsnumber=intenum;
                    sys_id=webexcc.insert();
    
                    
                                
                }    
                return sys_id;
           },

Method changes on UI pages

  1. Go to filter navigator and search for UI pages

    Select the UI Pages option under System UI.

    ServiceNow developer instance filter navigator with search for ‘Ui page’

  2. Filter the UI Pages with Name and search for agentdesktop.

    ServiceNow developer instance UI Pages with Name filter applied to search.

  3. Change the nowActivities and screenpop function in the script.

    ServiceNow developer instance UI Page – agentdesktop.

    Current function:

    function nowActivities(actInfo, ani) {
        
        var gaout = new GlideAjax('propUtils');
        gaout.addParam('sysparm_name', 'setWebexcctable');
        gaout.addParam('actInfo', JSON.stringify(actInfo));
        gaout.addParam('ani', stripPrefixes(ani));
        gaout.getXML(SetCCsysId);
    
    
    }

    Sample code for the incident:

    function nowActivities(actInfo, ani) {
        var sysObjstr = window.localStorage.getItem("screenpopinteraction");
        if(sysObjstr != null && sysObjstr != undefined)
        {
            var sysObjjson=JSON.parse(sysObjstr);
            actInfo.interaction_sys_id=sysObjjson.sysid;
            actInfo.incident_sys_id=sysObjjson.incsysid;
        }
        var gaout = new GlideAjax('propUtils');
        gaout.addParam('sysparm_name', 'setWebexcctable');
        gaout.addParam('actInfo', JSON.stringify(actInfo));
        gaout.addParam('ani', stripPrefixes(ani));
        gaout.getXML(SetCCsysId);
    
    
    }
    
    function screenpop(callerani,callSessionInfo) {
       
    
        if(callerani===callSessionInfo.phoneNumber){
            callerani=stripPrefixes(callerani);
        }
        
        var gaout = new GlideAjax('propUtils');
            gaout.addParam('sysparm_name', 'UserGetSysId');
            gaout.addParam('field', 'phone');
            gaout.addParam('value', callerani);
            gaout.getXMLWait();
          // var sysid = gaout.getAnswer();
          var sysObj = JSON.parse(gaout.getAnswer());
        
        if(sysObj.incsysid){
            openFrameAPI.openServiceNowForm({
            entity: 'incident',
            query: 'sys_id='+sysObj.incsysid, 
            'interaction_sys_id': sysObj.sysid  
           });
        }else{
            openFrameAPI.openServiceNowForm({
            entity: 'incident',
            query: 'sys_id=-1',
            'interaction_sys_id': sysObj.sysid  
           });
        }
        window.localStorage.setItem("screenpopinteraction",JSON.stringify(sysObj));
            
       
    }
    
    

Results after the update

ServiceNow developer instance Phone Logs page.

The following customizations apply to versions 1.0.5 and below. For the customizations for the newer versions 1.0.7 and above, follow the steps above.

Customization # 1 - Add custom business rules for call flow use cases

Create a new incident record for every call

For every new call into the WebexCC CRM connector in ServiceNow, create a New Incident Record.

  1. Search for Business Rules on the Filter navigator

    ServiceNow developer instance Business Rules page header.
  2. Click New.

    ServiceNow developer instance Business Rule – New Record.

    Sample code for reference:

    function customcti() {
                var url = null;
                var name = sysparm_caller_name;
                eid = sysparm_caller_id;
                var phone = sysparm_caller_phone;
                var taskID = sysparm_task_id;
                var fQuery = sysparm_query;
                if (fQuery == null)
                   fQuery = '';
                var view = sysparm_view;
                if (view == null || view == '')
                    view = "itil";
     
                var userID = null;
                if (eid != null && eid != '') {
                    userID = UserGetSysId("employee_number",eid);
                }
                if (userID == null && name != null && name != '') {
                    userID = UserGetSysId("name", name);                
                }
                if (userID == null && phone != null && phone != '') {
                    userID = UserGetSysId("phone", phone);
                }
     
                if (userID != null) {
                    if (fQuery.length > 0)
                        fQuery += "^";
                    fQuery += "caller_id=" + userID;
                }
                if (url == null) {
                    url = "incident.do?sys_id=-1";
                    if (fQuery != null)
                       url += "&sysparm_query=" + fQuery;
                }
                answer = url;
                return url;
    }
     
    function UserGetSysId(field, value) {
      var user = new GlideRecord("sys_user");
      user.addQuery(field, value);
      user.query();
      if (user.next())
         return user.sys_id;
      else
         return null;
    }

    Sample configuration of the business rule

    ServiceNow developer instance Business Rule – CTI Processing For Incident page as a sample configuration of the business rule.
  3. Enable Client callable

    ServiceNow developer instance Business Rules page with the Personalized List Columns popup screen showing ‘Client callable’ in the ‘Selected’ column.

    Computer Telephony Integration (CTI) Processing For Incident is marked as True.

    ServiceNow developer instance Business Rules page showing the Client callable column with options to select ‘true’ or ‘false’
  4. Update the screenpop url with the custom CTI Rule " cti.do?sysparm_cti_rule=createIncident&sysparm_caller_phone="

    System Property page for screenpop_url showing update to the custom CTI rule in the ‘Value’ field.
Example

The sysparm_cti_rule=name where 'name' is the name of a function is to be invoked for CTI Processing rather than using the default script.

Define the function in a sys_script entry marked client callable.

If you must insert, update, or delete any GlideRecord(s) in the function, call a separate nonclient callable function to perform the updates.

To make a script client-callable, you must check the client-callable check box on the form that displays when the sys_script entry is displayed.

The client-callable check box doesn't show up by default. To view, you must modify the fields that show on the form using the gear icon and slush bucket mechanism.

References

Customization # 2 - Add CAD variable in Webex Contact Center activity table

Overview

This article details the process to add an additional column to the ServiceNow table - webexcc_activity that is created upon the installation of the Webex CC for ServiceNow CRM Connector.

By default, the table contains out-of-box system fields and values.

You can potentially create more business-specific variables (CAD Variables) inside the WebexCC Flow designer and add those CAD variables inside the ServiceNow post call activity log, and persist this to the post call activity table data.

  • This is reference documentation only - and shows how to do this for a sample CAD variable called Customer Name that stores the customer name inside the IVR and posts this to ServiceNow.

  • The partner+customer ServiceNow developers will configure and manage this configuration as it is a customization to the existing connector.

  • Cisco will only provide the techniques on how to customize and extend the connector.

  • As of this article, the Cisco team has validated support for the addition of CAD variable to the Activity Log and Activity Table using the technique described below.

Add column to WebexCC activity
  1. Edit the table in the developer version of ServiceNow.

    ServiceNow developer instance Table – WebexCC Activity page.
  2. Go to the Studio > Webex Contact Center.

    ServiceNow developer instance filter navigator search for ‘studio’  highlighting the cross launch search result for ‘App Engine Studio’

    App Engine Studio Select Application screen showing Webex Contact Center in the search results.

    App Engine Studio Webex Contact Center screen.

  3. Select WebexCC Activity table.

    App Engine Studio WebexCC Activity table.
  4. For example, CustomerName.

    App Engine Studio WebexCC Activity table column edit example for ‘CustomerName’ column.

    App Engine Studio WebexCC Activity table screen.

  5. Select List Layout for WebexCC Activity.

    App Engine Studio WebexCC Activity table list layout showing ‘CustomerName’ highlighted in the ‘Selected’ column.
Create a new Script Includes

This step is not required if you are using the Update Set XML - Only one line is required to be added "webexcc.u_customername=actInfo.CustomerName" to propUtils.

ServiceNow developer instance filter navigator search for ‘script includes’

ServiceNow developer instance Script Includes page with ‘Application’ in the filter.

ServiceNow developer instance Script Includes – New Record page.

Sample script

See the line with:webexcc.u_customername=actInfo.CustomerName; with a supporting comment.

var propUtils2 = Class.create();
propUtils2.prototype = Object.extendsObject(global.AbstractAjaxProcessor,{
         getWebexccProp : function () {
           var webexccprop = {};
           webexccprop.instanceurl= 'https://'+gs.getProperty('instance_name')+'.service-now.com/';
           webexccprop.url=gs.getProperty('x_caci_webexcc.agentdesktop_url');
           webexccprop.popupurl=gs.getProperty('x_caci_webexcc.screenpop_url');
           return  JSON.stringify(webexccprop);
      
        },
        setWebexcctable : function () {
            var sys_id=0;
             
            var actInfo = JSON.parse(this.getParameter('actInfo'));
            var webexcc = new GlideRecordSecure(gs.getProperty('x_caci_webexcc.webexccactivitytable'));
            webexcc.addQuery("callobject", actInfo.CallObject);
            webexcc.query();
            if(!webexcc.next()) {
                webexcc.ani = actInfo.ani;
                webexcc.dnis =actInfo.dnis; 
                webexcc.queuename =actInfo.queuename;
                webexcc.wrapuptime =actInfo.wrapuptime;
                webexcc.callduration =actInfo.CallDurationInSeconds;
                webexcc.ringingtime =actInfo.ringingtime;
                webexcc.activitydate =actInfo.ActivityDate;
                webexcc.callobject =actInfo.CallObject;
                webexcc.calltype =actInfo.CallType;
                webexcc.calldisposition=actInfo.CallDisposition;
 
               // This line is Added - to capture it in the Activity Log
               webexcc.u_customername=actInfo.CustomerName;
 
                sys_id=webexcc.insert();
  
                // Activities on Incident record;
                var actInfoString =this.getParameter('actInfo');
                var suser = new GlideRecordSecure("sys_user");
                    suser.addQuery("phone", this.getParameter('ani'));
                    suser.query();
                    if(suser.next()) {
                    var inc = new GlideRecordSecure('incident');
                            inc.addQuery('caller_id', suser.sys_id);
                            inc.orderByDesc('sys_created_on');
                            inc.query();
                                if (inc.next()) {
                                    var jsonPretty = JSON.stringify(JSON.parse(acting string),null,2);  
                                    inc.comments =jsonPretty;
                                inc.update();
                                 }
                    } 
            }    
            return sys_id;
       },
 
    type: 'propUtils2'
});
Edit the UI page with a new script nameApp Engine Studio agentdesktop UI page with new script name.

Create a CAD variable in Flow designerWebex Contact Center flow designer with Add Flow Variable popup showing adding a CustomerName variable.

Add the CAD variable to the Desktop LayoutWebex Contact Center CAD variable to the desktop layout script with ‘CustomerName:CustomerName’ highlighted.

Demo screenshots

View the newly added CAD variable in the WebexCC Activity table.

ServiceNow developer instance showing newly added CAD variable in the WebexCC Activity table.

ServiceNow developer instance WebexCC Activities screen.