You can control the Overcentric Dock, the floating widget that provides access to our Chat Support and Help Center, directly from your website or product using a simple JavaScript API.
This gives you more flexibility to integrate our support features into your user experience.
To programmatically open or close the Dock, you can use the following functions:
openDock(): This function opens the Dock, but only if it's enabled in your configuration. It's a great way to provide a custom button or link that triggers the widget to appear.
closeDock(): This function immediately closes the Dock if it's currently open.
Example Usage:
Open the Dock when a user clicks a button:
document.getElementById('myOpenButton').addEventListener('click', () => { overcentric.openDock();});Close the Dock:
window.addEventListener('beforeunload', () => { overcentric.closeDock();});API Availability: Ensure the Overcentric JavaScript SDK is properly loaded on your page before calling these functions.
Error Handling: The functions openHCArticle() and openChat() include basic checks to ensure the provided arguments are valid and that the respective features are enabled. If an articleId is invalid or missing, an error will be logged to the console.
Timings: Some of these functions use a small delay (setTimeout) to ensure the view is properly set before the Dock opens. This is a normal part of the process and ensures a smooth user experience.
You can also use the API to open the Dock to a specific view, such as the Chat Support window or a particular Help Center article.
openChat(): This function opens the Dock and automatically navigates the user to the Chat Support view, but only if chat is enabled.
openHC(): This function opens the Dock and directs the user to the Help Center home page, but only if the Help Center is enabled.
openHCArticle(articleId): This is a powerful function that lets you open the Dock and display a specific Help Center article. The articleId is the unique slug and public ID of the article (e.g., getting-started/abc123def456). This is perfect for linking directly to relevant help content from different parts of your application.