Genesys Widgets Deployment Guide

This guide provides the steps required to instrument your website with Genesys Widgets.

Audience

This document is for website developers who are in charge of the website code. You should have knowledge of HTML, JavaScript, and CSS.

How Do I Deploy Genesys Widgets?

1. Embed Genesys Widgets into your website
2. Configure your Genesys Widgets
3. Setup Localization Options and Languages
4. Styling Genesys Widgets

How to embed the Genesys Widgets into your website

Unzip the Genesys Widgets package to your web server, and then locate the path to your copy of the cx-widget.min.js file.

you can choose from the following methods to include the Genesys Widgets package on your webpage:

Inline Javascript Include

Add a script tag to include the Genesys Widgets package file (cx-widget.min.js)

<script id="genesys-cx-widget" src="http://www.yourhost.com/path/to/cx-widget.min.js"></script>

Dynamically Generate the Javascript Include

The following code snippet will generate a script include tag automatically and provides you the option of loading the file immediately or delay loading the file until after the parent page has finished loading its content

// CX-Widget Instrumentation Script
<script>
    (function(d, s, id, o){
      var f = function(){
        var fs = d.getElementsByTagName(s)[0], e;
        if (d.getElementById(id)) return;e = d.createElement(s); e.id = id;
        e.src = o.src;fs.parentNode.insertBefore(e, fs);
      },ol = window.onload;
      if(o.onload){typeof window.onload != "function"?window.onload=f:window.onload=function(){ol();f()}}else f();
    })(document,'script','genesys-cx-widget', {src: "http://www.yourhost.com/path/to/cx-widget.min.js", onload: false});
</script>

This script will dynamically generate a Javascript include <script> tag and place it into the page. By default the ID for the generated script tag is "genesys-cx-widget". You may modify this ID in the above script.

The following object is passed in with additional options:

{src: "http://www.yourhost.com/path/to/cx-widget.min.js", onload: false}

src

src is the URL or path to the location of the Genesys Widgets Javascript library that Genesys provides. You can host the library on your own web servers or on a Content Delivery Network (CDN).

onload

onload is an optional flag that, when set to true, will delay loading the CX Widget script until after the webpage has fully loaded (window.onload). By default this value is false and the CX Widget script is loaded immediately.

Now you can configure the Genesys Widget and the products and services associated with it.