Embeddable Widget APIs
The Embeddable Widget APIs allow you to customize the widgets. For example, you can hide the widget in certain pages or prefill some fields when your customer opens the Contact Form.
The following actions can be done using the widget APIs.
- Hide Launcher button.
- Show Launcher button.
- Open the widget.
- Close the widget.
- Prefill Form fields.
- Open a article
Hide Launcher Button
If you already have a button or link on your website that should launch the Help Widget, and you want to hide the Launcher button for the widget, use the API listed below.
BolddeskWidget('hide', 'launcher')
Show Launcher Button
You can use the APIs listed below to show the Launcher button that is hidden.
BolddeskWidget('show', 'launcher')
Open the Widget
You can use the Open API if you want the widget to open when a customer clicks a link or button on your website.
BolddeskWidget('open', 'popup')
To know how to open the widget pop-up on the external button/link click, please refer to this article:
How to Launch a Help Widget on Button Click
Close the Widget
If the widget is already open, use this API to close it.
BolddeskWidget('close', 'popup')
Prefill Form Fields
To fill out the form, simply use the Prefill API. For dropdown type (single or multi-select), assign the id as the value. For other fields, simply assign a string value.
BolddeskWidget (fill, form, {
name: 'Daniel',
emailId: 'daniel@afgc.inc',
categoryId: 12,
cf_country: 21,
cf_state: 17
});
Open a article
You can use this API to open a article when your customers click on a link on your website. When using this API, you need to provide the article ID.
BolddeskWidget('open', 'article', {
id: 123 // article ID
});
Onload Customization
Add the following script above the embedded code to hide the Launcher and pre-fill the form fields when the page loads.
<script>
window.BolddeskWidgetConfig = {
widget: {
hideLauncher: true
},
form: {
fill: { name: "Daniel", emailId: "'daniel@afgc.inc'", categoryId: 12 }
},
created: (args) => {
// When the widget is rendered, the created event will be triggered.
}
}
</script>
When a widget is rendered, the created event will be triggered. The following properties can be found in the created event argument.
{
type: widget,
id: Widget Id,
name: Widget Name
}