{"versionId":"53b04aca-cf4a-425b-95db-08dc842a2812","articleId":"0282568b-2998-41fb-add4-08db61433716","title":"Chat widget API","tags":["context","technical","integrations","All articles"],"content":"<p>FAQ Bot has a simple API to allow interactions between the page hosting the widget and the bot. This article details the possible interactions, and is aimed at a technical (developer) audience.</p>\n<p>There are three types of interactions between the page and bot</p>\n<ol>\n<li>Opening / Closing the bot</li>\n<li>Set <a href=\"https://help.faqbot.ai/article/using-context-in-faq-bot\" target=\"_blank\" rel=\"noopener\">context</a></li>\n<li>Ask Questions / Trigger <a href=\"https://help.faqbot.ai/article/engagements\" target=\"_blank\" rel=\"noopener\">Engagements</a></li>\n</ol>\n<p>The API is accessed via the&nbsp;<code>faqbot</code> object i.e. <code>faqbot.open()</code></p>\n<p>&nbsp;</p>\n<h2>Available API operations</h2>\n<ul>\n<li>askQuestion - asks a question on the user's behalf</li>\n<li>clearChatHistory - creates a new conversation for the same user</li>\n<li>clearUserAndChatHistory - creates a new user and conversation</li>\n<li>close - closes the chat window</li>\n<li>mount - adds the bot back on to the page (i.e. makes it visible again)</li>\n<li>open - opens up the widget to show chat window</li>\n<li>setContext - sets context</li>\n<li>toggleMenu - opens the widget menu</li>\n<li>triggerEngagementEvent - triggers an engagement event</li>\n<li>unmount - Removes the bot from the page entirely</li>\n</ul>\n<p>&nbsp;</p>\n<h2>Opening / Closing the chatbot</h2>\n<p>This can be done by calling the open or close api calls.</p>\n<p>for example:</p>\n<p><code>faqbot.open();</code></p>\n<h2>Asking questions&nbsp;</h2>\n<p>This can be done with&nbsp;</p>\n<p><code>faqbot.askQuestion(\"What products are on sale?\");</code></p>\n<p>The question will be asked of the bot exactly as if the user had typed the question themselves into the widget.</p>\n<h2>Triggering events</h2>\n<p><code>faqbot.triggerEngagementEvent(\"eventName\")</code> This will trigger an <a href=\"https://help.faqbot.ai/article/engagements\" target=\"_blank\" rel=\"noopener\">engagement</a> called \"eventName\"</p>\n<p>for example:</p>\n<p><code>faqbot.triggerEngagementEvent(\"salesEngagement\");</code></p>\n<h2>Setting context</h2>\n<p>You can share information from the page to the bot (eg location, logged in user name, URL, etc).<br>The bot can store this information about the user as context. This can be provided by the page via the <code>setContext</code>&nbsp;api call:</p>\n<p><code>faqbot.setContext({contextKey: \"contextValue\"})</code></p>\n<p>e.g.</p>\n<p><code>faqbot.setContext({email: \"user@faqbot.nz\"})</code></p>\n<p>You will need to have corresponding context keys set up &nbsp;- <a href=\"https://help.faqbot.ai/article/using-context-in-faq-bot\" target=\"_blank\" rel=\"noopener\">find out more</a>.</p>\n<p>&nbsp;</p>\n<h2>Other considerations</h2>\n<h3>Ensure chatbot is loaded before trying to interact with it</h3>\n<p>Something to consider when writing your Javascript to interact with the bot is that it may not have loaded yet. You will need to wrap your calls to the API around checking it has loaded and trying again in a timeout.&nbsp;</p>\n<p>e.g.</p>\n<pre class=\"language-javascript\"><code>function openBot() {\n  if (window.faqbot) {\n    faqbot.open();\n  } else {\n   setTimeout(openBot, 500);\n  }\n}</code></pre>","description":"","isMarkdown":false,"publishedOnUtc":"2024-06-04T21:30:15.9460904","modifiedOnUtc":"2023-06-09T02:55:19.0336638"}