Working with the ASAP Web Add-On (API Documentation)
Introduction


Code Snippet

 

	
Copy the following script and paste it into your website's HTML source code before the closing <body> tag. This code must be inserted into every page you want to show the widget on.

	<script type="text/javascript" > window.ZohoHCAsap=window.ZohoHCAsap||function(a,b){ZohoHCAsap[a]=b;};(function(){var d=document; var s=d.createElement("script");s.type="text/javascript";s.defer=true; s.src="https://desk.zoho.com/portal/api/web/inapp/305163000000116017?orgId=671712306"; d.getElementsByTagName("head")[0].appendChild(s); })(); </script>

The ASAP web add-on makes your help center available within quick reach for your end-customers. By integrating this add-on with your website, you can provide your customers with easy access to your:

* Customer support team (to raise tickets or chat with support agents)

* Knowledge base (to access help articles)

* User community (to interact with other customers)

You can choose to display the same add-on across all the pages of your website or a unique add-on for each webpage. Following the latter approach would deliver contextual support for your end-customers. For instance, if you run an e-commerce business, you can display a department-specific add-on, on the page for each department, i.e., the add-on for the Electronics page can be configured to display help articles related to electronics alone, while the add-on for the Footwear page can be configured to display help articles related to footwear alone, and so on.

What ASAP means to your end-customers is that they do not have to navigate to a different page on your website to access help articles or seek help from your customer service personnel or interact with fellow users of your service or product. Clicking a single icon on your website would provide them with quick access to your help center.

For information on how to set up the web add-on, click here.

This document lists the different properties, events, and APIs related to the ASAP web add-on.



Add-On Configuration Properties

JavaScript Example

window.ZohoHCAsapSettings={
  // key pair values
};

How to use it

<script type="text/javascript">
  window.ZohoHCAsapSettings = {

    hideLauncherIcon : true,
    ticketsSettings : {
      preFillFields : {
        "email" : {
          defaultValue : "iniankarthi@hmail.com"
        },
        "departmentId" : {
          defaultValue : "36277000001304058"
        },
        "contactId" : {
          defaultValue : "Marco Polo"
        }
      }
    },
    userInfo :{
      token : "WECYKhrkZLTq11DqYxA/C/Poz07N/C8bS1sKZZY6WkReuPDTxoFRNFf674bp+mG4UiBg91ATeYPwdWrfJby7gQ=="
    }

  };
  </script>

You can configure the ASAP add-on to behave a certain way at the time of loading on the webpage. This is made possible through the configuration properties of the add-on.

To configure the add-on as required, pass the properties as a JSON object in the window.ZohoHCAsapSettings method. Any changes you make to the properties are reflected the next time the add-on is loaded.


The different configuration properties and their purposes are as follows.


hideLauncherIcon

boolean

To hide the icon at the time of loading the add-on


ticketsSettings

JSON object

To populate the Submit Ticket form in the add-on with the necessary fields


userInfo

JSON object

To log the user into the add-on at the time of loading



ASAP Ready Event

JavaScript Example

window.ZohoHCAsapReady=function(o){if(window.ZohoHCAsap__asyncalls=window.ZohoHCAsap__asyncalls||[],window.ZohoHCAsapReadyStatus){o&&window.ZohoHCAsap__asyncalls.push(o);for(var a=window.ZohoHCAsap__asyncalls,s=0;s

example source <>

ZohoHCAsapReady(function(){ /* call your methods or our methods */ });

This event is executed after the ASAP add-on becomes ready for use on the webpage. Changing the add-on's properties or behaviors in this event would make sure that the modified configuration is reflected after the add-on is ready. You can include additional tasks as functions in the event code.

Note: Make sure to include this event before the installation code snippet in the HTML source code.



Open Add-On

JavaScript Example

ZohoHCAsap.Action - function

example source <>
ZohoHCAsapReady(function(){ ZohoHCAsap.Action("open"); })

How to use it
 var openApp = ZohoHCAsapReady(function(){ ZohoHCAsap.Action("open"); }) 
  <span class="demo-btn" onclick="openApp();" > View Demo </span>
View Demo

This method opens the add-on with the last set of activities performed.



Close Add-On

JavaScript Example

ZohoHCAsap.Action - function

example source <> 
ZohoHCAsapReady(function(){ ZohoHCAsap.Action("close"); })

How to use it
var closeApp = ZohoHCAsapReady(function(){ ZohoHCAsap.Action("close"); }) 
  <span class="demo-btn" onclick="closeApp();" > View Demo </span>
View Demo

This method closes the add-on and saves the last set of activities performed.



Open Tab

JavaScript Example

ZohoHCAsap.Action - function
Tab Names
KB, COMMUNITY, TICKETS

example source <> 
ZohoHCAsapReady(function(){ ZohoHCAsap.Action("open",{tab:"TICKETS"}); })

How to use it
var openTicketsTab = ZohoHCAsapReady(function(){ ZohoHCAsap.Action('open',{tab:'TICKETS'}); }) 
 <span class="demo-btn" onclick="openTicketsTab()" > View Demo </span>
View Demo

This method opens a specific module on the add-on.



Hide Add-On Launcher

JavaScript Example

ZohoHCAsap.Action - function

example source <> 
ZohoHCAsapReady(function(){ ZohoHCAsap.Action("hideLauncher"); })

How to use it
var hideLauncher = ZohoHCAsapReady(function(){ ZohoHCAsap.Action('hideLauncher'); }) 
  <span class="demo-btn" onclick="hideLauncher();" > View Demo </span>
View Demo

This method hides the add-on icon on the webpage.



Show Add-On Launcher

JavaScript Example

ZohoHCAsap.Action - function

example source <>
ZohoHCAsapReady(function(){ ZohoHCAsap.Action("showLauncher"); });

How to use it
var showLauncher = ZohoHCAsapReady(function(){ ZohoHCAsap.Action('showLauncher'); }) 
 <span class="demo-btn" onclick="showLauncher();" > View Demo </span>
View Demo

This method displays the add-on icon on the webpage.



Log User In

JavaScript Example

ZohoHCAsap.Login - function

example source <> 
 var userInformation = { token : "WECYKhrkZLTq11DqYxA/C/Poz07N/C8bS1sKZZY6WkReuPDTxoFRNFf674bp+mG4UiBg91ATeYPwdWrfJby7gQ==" };  ZohoHCAsapReady(function(){ ZohoHCAsap.Login(userInformation); })


How to use it
var userInformation = { token : "WECYKhrkZLTq11DqYxA/C/Poz07N/C8bS1sKZZY6WkReuPDTxoFRNFf674bp+mG4UiBg91ATeYPwdWrfJby7gQ==" }; 
 

var loginApp = ZohoHCAsapReady(function(){ ZohoHCAsap.Login(userInformation); }) 

  <span class="demo-btn" onclick="loginApp();" > View Demo </span>

This method logs a user into the add-on.



Log User Out

JavaScript Example

ZohoHCAsap.Logout - function

example source <>
ZohoHCAsapReady(function(){ ZohoHCAsap.Logout(); });

How to use it
var logoutApp = ZohoHCAsapReady(function(){ ZohoHCAsap.Logout(); }) 
 <span class="demo-btn" onclick="logoutApp();" > View Demo </span>

This method logs a user out from the add-on.



JavaScript Example

ZohoHCAsap.kbArticles.view( { articleId : 'article_id' } )
example source <>
 var viewArticle = ZohoHCAsapReady(function(){ ZohoHCAsap.kbArticles.view( { articleId : '305163000000109120' } ); }) 
 <span onclick="viewArticle();" > View Demo </span>
View Demo

Methods for Accessing Knowledge Base Data

These methods help access, list, and search the articles in your knowledge base. Use these methods if you plan to retain the default UI of the ASAP add-on.


Get article

This method retrieves a specific help article from your knowledge base and displays its content on the add-on UI.

Argument

articleId

string

ID of the article to fetch



List articles

JavaScript Example

ZohoHCAsap.kbArticles.List( { categoryId : 'category_id' })
example source <>
 var viewArticlesList = ZohoHCAsapReady(function(){  ZohoHCAsap.kbArticles.list( { categoryId : '305163000000092385' , includeChildCategoryArticles : true  } ); }) 
 <span onclick="viewArticlesList();" > View Demo </span> 
View Demo

This method lists a particular number of help articles, based on the limit specified


Arguments

categoryId

string

ID of the category to which the articles must belong


includeChildCategoryArticles

boolean

Key that denotes if articles from the child category must also be fetched


sortBy

Key that sorts articles by a specific attribute:

  • [+-]likeCount
  • [+-]viewCount
  • [+-]unlikeCount
  • [+-]createdTime
  • [+-]modifiedTime

from

number

Index number, starting from which the articles must be fetched


limit

number

Number of articles to fetch


tag

string

Tags associated with the help articles


Search articles

JavaScript Example

ZohoHCAsap.kbArticles.search( { searchWords : 'search_word' })

example source <>
var viewSearchArticlesList = ZohoHCAsapReady(function(){ ZohoHCAsap.kbArticles.search( { searchWords : 'article' } ); }) 
 <span onclick="viewSearchArticlesList();" > View Demo </span> 
View Demo

This method searches for specific help articles in your knowledge base. You can use this method to auto-suggest help articles to customers, based on the webpage they are on. All that is required to do is to map the webpage with the relevant articles.


Arguments

categoryId

string

ID of the category to which the articles must belong


from

number

Index number, starting from which the articles must be fetched


limit

number

Number of articles to fetch


searchWords

String

Keyword to use for the search


List categories

JavaScript Example

ZohoHCAsap.kbCategories( )

example source <>
var viewCategory = ZohoHCAsapReady(function(){ ZohoHCAsap.kbCategories(); }) 
 <span onclick="viewCategory();" > View Demo </span>
 View Demo  
ZohoHCAsap.kbCategories( { categoryId : 'category_id' } )

example source <>
var viewCategory = ZohoHCAsapReady(function(){ ZohoHCAsap.kbCategories( { categoryId : '305163000000092385' } ); }) 
 <span onclick="viewCategory();" > View Demo </span> 
 View Demo

This method lists the article categories configured in your knowledge base.


Arguments

categoryId

string

IDs of the categories to list


Methods for Accessing Community Data

These methods help access, list, and search the topics in your community. Use these methods if you plan to retain the default UI of the ASAP add-on.

Get topic

JavaScript Example

ZohoHCAsap.communityTopics.view( { topicId : 'topic_id' } )

example source <>
var viewTopic = ZohoHCAsapReady(function(){ ZohoHCAsap.communityTopics.view( { categoryId : '448656000000009001' } ); }) 
 <span onclick="viewTopic();" > View Demo </span>
View Demo

This method retrieves a specific topic from your community and displays its content on the add-on UI.


Arguments

topicId

string

ID of the topic to fetch



List topics

JavaScript Example

ZohoHCAsap.communityTopics.list( { categoryId : 'category_id' } )

example source <>
var listAllTopic = ZohoHCAsapReady(function(){ ZohoHCAsap.communityTopics.list( { categoryId : '448656000000003013' } ); }) 
 <span onclick="listAllTopic();" > View Demo </span>
View Demo

This method lists a particular number of topics, based on the limit specified.


Arguments

categoryId

string

ID of the category to which the topics must belong

isSticky

boolean

Key that denotes if the topics to list must be sticky topics

type

string

Type to which the topics must belong

Values supported are:

  • [+-]QUESTION
  • [+-]IDEA
  • [+-]ANNOUNCEMENT
  • [+-]PROBLEM
  • [+-]DISCUSSION

tagName

string

Key that lists topics associated with a particular tag

label

string

Key that lists topics by their label


Values allowed are:

nostatus, needmoreinfo, workingonit, answered, unanswered, maybelater, underreview, implemented, willnotimplement, notaproblem, temporaryfix, analyzing, solved, unsolved, mostvoted and inprogress

includeCount

boolean

Key that denotes if the topic count must be displayed

from

number

Index number, starting from which the topics must be fetched

limit

number

Number of topics to fetch



Search topics

JavaScript Example

ZohoHCAsap.communityTopics.search( { searchWords  : 'search_Word' } )

example source <>
var searchAllTopic = ZohoHCAsapReady(function(){ ZohoHCAsap.communityTopics.search( { searchWords : 'post' } ); }) 
 <span onclick="searchAllTopic();" > View Demo </span>
View Demo

This method searches for specific topics in the user community. You can use this method to auto-suggest topics to customers, based on the webpage they are on. All that is required to do is to map the webpage with the relevant topics.


Arguments

categoryId

string

ID of the category to which the topics must belong

from

number

Index number, starting from which the topics must be fetched

limit

number

Number of topics to fetch

includeCount

boolean

Key that denotes if the topic count must be displayed

type

string

Type to which the topics must belong

Values supported are:

  • [+-]QUESTION
  • [+-]IDEA
  • [+-]ANNOUNCEMENT
  • [+-]PROBLEM
  • [+-]DISCUSSION

searchWords

string

Keyword to use for the search



List categories

JavaScript Example

ZohoHCAsap.communityCategories()

example source <>
var listCategory = ZohoHCAsapReady(function(){ ZohoHCAsap.communityCategories( ); }) 
 <span onclick="listCategory();" > View Demo </span>
View Demo  
ZohoHCAsap.communityCategories({ categoryId : 'category_id' })

example source <>
var openCategory = ZohoHCAsapReady(function(){ ZohoHCAsap.communityCategories( { categoryId : '448656000000003013' }); }) 
 <span onclick="openCategory();" > View Demo </span>
 View Demo

This method lists the topic categories configured in your user community.


Arguments

categoryId

string

IDs of the categories to list