Terminus Chat Engagement Window API

The Terminus Chat Engagement Window (EW) API exposes a Javascript API to interact with your page's chat engagement window. By adding a couple of lines to the standard Terminus Chat code snippet, the EW API allows your team to:

• Open the Terminus Chat engagement window upon page load
• Open the Terminus Chat engagement window based upon an action (such as a button click)

How to Deploy This API:

First, you will need to capture the unique embed code generated for your website chat. To do this, navigate to the “Links & Website Chat” menu option in the Chat Experiences interface, located on the left panel, and then copy the unique code for the Website Chat that you’d like to deploy.

You can find your complete standard Terminus Chat code snippet by clicking on the respective Website Chat. In the top right corner, you will find a blue “Copy Code” button. 

If you are sharing this code with someone, we strongly recommend saving and sharing the code as a .txt file rather than pasting into an email body.

Once you have identified your standard code snippet, complete the following steps for your desired Engagement Window API action.

Open the Terminus Chat Engagement Window upon Page Load

• On the pages where you want the chat window to automatically open upon page load, simply add the lines highlighted in red to the standard Terminus Chat code snippet. 

Note: We typically recommend deploying chat on the global footer as a best practice. When implementing these additional lines on specific pages across your site, please ensure that you do not deploy duplicate code snippets on a page. If you deploy more than one Terminus Chat code snippet on a page, the chat window may appear more than once.

<script type="text/javascript">

function onRambleLoad() {

   Ramble.init({

       code: "UNIQUE WEBSITE CHAT CODE",

       realtimeUrl: "https://realtime.ramblechat.com",

       fileStoreUrl: "https://cdn.ramblechat.com",

       resolveUTMVariables: true,

       // other options:

       // initialName: string - use value as visitor name

       // initialEmail: string - use value as visitor email

       // page: string - use value as the page

       // customVariables: object - pass any custom variables to attach to the chat

       // onButtonClick(show: boolean, firstTime: boolean) - button click callback

       // onButtonDisplayed(buttonEl: HTMLElement) - button appear on the screen callback

       // onInit(params: { visitorUuid: string, connectionType: "new" | "restored", chatUuid?: string })

- Ramble init callback

       // onChatRequested(params: { visitorUuid: string; chatUuid: string }) - Visitor requested chat callback

       // onChatAnswered(params: { visitorUuid: string; chatUuid: string }) - Chat answered callback

       // onChatCompleted(params: { visitorUuid: string; chatUuid: string; type: "missed" | "answered" }) - Chat completed callback

       // onChatMessage(params: { visitorUuid: string; chatUuid: string }) - New message arrived callback

       // forceGDPR: boolean - Force GDPR consent request for all locations

   }).then(function (api) {

 window.RAMBLE_API = api;

 api.changeVisibility(true, true);

});

}

function lr(e){console.error("Unable to load ramble snippet: "+e.message);};var s=document.createElement("script");s.onerror=lr;s.onload=onRambleLoad;document.head.appendChild(s);s.async=true;s.src="https://snippet.ramblechat.com/ramble.snippet.js";

</script>

Open the Terminus Chat Engagement Window upon JS Event 

• Update the code snippet on the applicable pages to include the red lines of code:

<script type="text/javascript">

function onRambleLoad() {

   Ramble.init({

       code: "UNIQUE WEBSITE CHAT CODE",

       realtimeUrl: "https://realtime.ramblechat.com",

       fileStoreUrl: "https://cdn.ramblechat.com",

       resolveUTMVariables: true,

       // other options:

       // initialName: string - use value as visitor name

       // initialEmail: string - use value as visitor email

       // page: string - use value as the page

       // customVariables: object - pass any custom variables to attach to the chat

       // onButtonClick(show: boolean, firstTime: boolean) - button click callback

       // onButtonDisplayed(buttonEl: HTMLElement) - button appear on the screen callback

       // onInit(params: { visitorUuid: string, connectionType: "new" | "restored", chatUuid?: string })

- Ramble init callback

       // onChatRequested(params: { visitorUuid: string; chatUuid: string }) - Visitor requested chat callback

       // onChatAnswered(params: { visitorUuid: string; chatUuid: string }) - Chat answered callback

       // onChatCompleted(params: { visitorUuid: string; chatUuid: string; type: "missed" | "answered" }) - Chat completed callback

       // onChatMessage(params: { visitorUuid: string; chatUuid: string }) - New message arrived callback

       // forceGDPR: boolean - Force GDPR consent request for all locations

   }).then(function (api) {

 window.RAMBLE_API = api;

});

}

function lr(e){console.error("Unable to load ramble snippet: "+e.message);};var s=document.createElement("script");s.onerror=lr;s.onload=onRambleLoad;document.head.appendChild(s);s.async=true;s.src="https://snippet.ramblechat.com/ramble.snippet.js";

</script>

• Add the line below to the respective JS event that you’d like to open the chat engagement window:

window.RAMBLE_API.changeVisibility(true, true);

Example for button click event: 

onclick="window.RAMBLE_API.changeVisibility(true, true);"