Digital Developer Resources

The CXone Mpower digital platform lets your agents interact with contactsClosed The person interacting with an agent, IVR, or bot in your contact center. through digital channels. Examples of digital channels are Facebook posts, WhatsApp messages, and chat widgets. For example, similar to calling a technical support phone number, contacts can also send a WhatsApp message to a technical support number. Digital channels expand your organization's ability to assist contacts using popular modes of communication.

The digital platform includes CXone Mpower Guide, which lets your website administrators quickly integrate the digital channels in your website and create engagement rules that determine when and where to offer the digital channels.

Depending on business needs, administrators and developers can employ a range of customization options within Digital Experience. You can, for example, add custom CSS to a chat widget. You can also customize the behavior of Guide using JavaScript. Furthermore, you can extend digital messaging into other platforms or set up digital channels that CXone Mpower doesn't yet support. For example, you can add digital chat to an existing mobile application by using the Mobile Chat SDK.

Out-of-the Box Customization Features

Use Guide to define branding settings, buttons, and templates. These let you set width, height, font size, colors, and other parameters using the Guide administration pages. You can set global design preferences at the branding level and then adjust the design at the template level. The template settings overrule the branding settings. You can use the Guide live preview feature when designing branding and templates to immediately see how the changes impact the appearance of the Guide interface.

JavaScript APIs

  • JavaScript API: Specific parts the Guide interface and chat user interface can be adjusted by adding JavaScript API commands. Among other items, you can set a date format, add terms of use, adjust width and height, or add custom CSS.

  • Custom CSS and JavaScript: If JavaScript level of customization is not enough, administrators can choose to adjust specific parts of the user interface by using either CSS and JavaScript settings or by using the JavaScript API command to add custom CSS.

    • For Digital Chat, custom CSS is available in chat settings and should be used along with custom JavaScript fields to build custom interactive messages. You would use the API to send HTML and then append CSS and JavaScript by placing them in chat settings, thus making sure your custom setup is secure and not vulnerable to XSS attacks and similar. You can also use custom CSS and JavaScript settings to make adjustments to overall user interface:

      • To apply global changes to the chat widget, place the custom CSS in the chat settings.

      • To only make changes on specific pages, place the custom CSS JavaScript API in the website snippet to run for the page.

      Both options are complementary to each other, that is, you can have a global set up in the settings and then overwrite those CSS by using JavaScript API on specific pages.

    • For Guide, you must use the JavaScript API command to add custom CSS.

      When adding custom CSS, always use data selectors. These guarantee that subsequent changes to Guide or chat code won’t impact your custom solution. If you add custom CSS tied to classes or elsewhere, NICE cannot guarantee supportability of such solution as these are programmatically generated and can be changed with each patch release. If you need data selectors added in specific places, reach out to your account representative.

SDKs

  • Web Chat SDK: Sometimes, your desired customizations are too complicated to make with custom CSS and custom JavaScript. In these cases, you can create your own user interface by using the CXone Mpower chat infrastructure. This is useful if you want full control over the user interface or are hesitant to add third-party snippets or apps to your website.

  • Mobile Chat SDK: While it is possible to run a standard chat window in a web view, this SDK offers much broader and fully native support for iOS and Android environments. You can use the UI/UX module and implement a prebuilt user interface. Alternatively, you can build your own user interface and only use underlying infrastructure.

Bring Your Own Channel

Bring Your Own Channel (BYOC) provides a generic integration option for platforms or channels that CXone Mpower does not yet support. This option typically requires you to stand up a middleware server and implement a set of BYOC APIs for back-and-forth communication with CXone Mpower.