Skip Navigation
Expand
Customizing a Proactive Chat Widget
Answer ID 6694   |   Last Review Date 11/18/2018

My Proactive Chat widget is not showing up.

Environment:

Customer Portal, Proactive Chat Widget

Resolution:

The sample code in this document or accessed through this document is not certified or supported by Oracle. It is intended for educational or testing purposes only. Use of this sample code implies acceptance of the License Agreement.

Sample Code for testing a Proactive Widget on an interface:

Change the <your_interface> to reflect your primary vhostname name.

This file can be tested using a browser from your desktop if you save it using an .html extension. The widget should appear after a delay of 5 seconds.

File============================

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
</head>
<body>

This is the basic page that has content which includes a syndicated chat widget

<div id="myDiv"></div>

<script type="text/javascript" src="https://<your_interface>.widget.custhelp.com/euf/rightnow/RightNow.Client.js"></script>

<script type="text/javascript">
    RightNow.Client.Controller.addComponent(
        {
            min_agents_avail: 0,
            seconds: 5,
            instance_id: "spac_0",
            div_id: "myDiv",
            module: "ProactiveChat",
            type: 2
        },
        "https://<your_interface>.widget.custhelp.com/ci/ws/get"
    );
</script>

</body>

End of File =============

The above file can make use of inline css styling:

Example of an inline style:
<style>
.widget {
background-color: #808080;
border: thin solid #000000;
border-radius: 1em;
display: inline-block !important;
margin: 2em;
padding: 1em;
width: 30em;
}

</style>

Link to documentation on what can be configured on the Proactive Chat Widget --a similar section will appear on your version documentation Configure the ProactiveChat widget.

You can generate the Widget code by access in the widget builder in the Customer Portal Administrative Page.

Example of a portion of the code that sets configuration settings that can be generated by using the widget builder:

avatar_image: "/euf/assets/images/<folder for your interface images>/avatar_photo_female.jpg",
chat_login_page: "/app/chat/chat_launch ",
chat_login_page_height: 400,
chat_login_page_width: 375,
label_accept_button: "Yes, Let's Chat",
label_logo_image: "Ready to chat with you",
label_refuse_checkbox: "No, Do not ask again",
label_reject_button: "No, Not right now",
label_title: "Chat with a Specialist",
logo_image: "/euf/assets/images/<your_interface>/logo.png",
min_agents_avail_type: "sessions",
min_agents_avail: 1,
seconds: myDiv1Timer/1000,
instance_id: "spac_0",
div_id: "myDiv1",
module: "ProactiveChat",
type: 2

For additional information, refer to the Syndicated Widgets section in online documentation for the version your site is currently running. To access Oracle Service Cloud manuals and documentation online, refer to the Documentation for Oracle Service Cloud Products.

Available Languages for this Answer:

Notify Me
The page will refresh upon submission. Any pending input will be lost.