Cention FAQ Widget 2.0.0

Introduction

This document describes embedding of Cention FAQ Widget inside your webpages so that users of the website can see your knowledge base. The FAQ show will be based on the knowledge base that setup in cention application that can be use as an external knowledge base.

Requirements

Jquery library is needed to run the faq widget.
The hostnames and ports combination of the websites that will serve the widget must be added to the Cross Origin Resource Control (CORS) whitelist in your Cention Contact Center system configuration.

You can embed the faq widget anywhere on your page by inserting the html code similar to the ones in the example below.

The following examples use https://cloud.cention.com/s/demo as the url where Cention Contact Center is hosted, and connects the faq to Cention area 1. You will have to replace them with the appropriate values for the example to work with your Cention Contact Center.

No customization

At the minimum the following must be specified when loading the widget:

Field	Description
libraryId	The ID of the knowledge base setup in Cention, this widget can support multiple knowledge base so you can provide more than 1 id, for example, `libraryId: [1, 2]`
areaId	The Cention area id (number) where the chat (if enabled) should be started in, or a list of area id (array of objects) for example, `areaId: [{id: 1, name: Area 1},{id: 2, name: Area 2}]`
CentionBaseURL	Global javascript variable. This is the url where your Cention Contact Center is hosted.

Example - no customization

<script type="text/javascript" src="{CENTION_BASE_URL}/cention/chat/js/jquery.min.js"></script>
<script type="text/javascript">var CentionBaseURL = "{CENTION_BASE_URL}";</script>
<script type="text/javascript"> var FAQ_WITH_CHAT = true; </script>
<script src="{CENTION_BASE_URL}/cention/chat/js/widget.js" type="text/javascript"></script>
<div id="cention-faq-container"></div>
<script type="text/javascript">
if(typeof CentionFAQ !== "undefined") {
  CentionFAQ("cention-faq-container", {
  	areaId: 1,
  	libraryId: [1], // please provide more than 1 library to properly test. Eg : [1,2,3,4]
	topList: true, // top featured
	topListLimit: 9, // limit number of list to be shown on toplist
	topListMinVotes: 0, // min votes required to be on toplist
	browseLibrary: true // enable browseLibrary
  });
}
</script>

Full customization

Many aspects of the faq widget can be customized. The following example list all the customizable settings at their default values.

Example - full customization

<script type="text/javascript" src="{CENTION_BASE_URL}/cention/chat/js/jquery.min.js"></script>
<script type="text/javascript">var CentionBaseURL = "{CENTION_BASE_URL}";</script>
<script type="text/javascript"> var FAQ_WITH_CHAT = true; </script>
<script src="{CENTION_BASE_URL}/cention/chat/js/widget.js" type="text/javascript"></script>
<div id="cention-faq-container"></div>
<script type="text/javascript">
if(typeof CentionFAQ !== "undefined") {
	CentionFAQ("cention-faq-container", {
		translation: {
			// {CHAT_I18N_KEYS} DO NOT REMOVE
		},
		css: {
			// CUSTOM_CSS
		},
		text: {
			// CUSTOM_TEXT
		},
		ui: {
			// CUSTOM_UI
		},
		areaId: 1,
		libraryId: [1], // please provide more than 1 library to properly test. Eg : [1,2,3,4]
		topList: true, // top featured
		topListLimit: 9, // limit number of list to be shown on toplist
		topListMinVotes: 0, // min votes required to be on toplist
		browseLibrary: true // enable browseLibrary
	});
}
</script>

FAQ config. guide

Screenshot given is the guide to the certain config setup

Questions

If you have any questions regarding the customizations process feel free to ask your excellent support team at which you can reach by emailing support@cention.com.