Show widget on the website

JavaScript API (Application Programming Interface) is a set of tools and protocols that allows different software programs or systems to communicate and interact with each other.

In essence, JavaScript API acts as a bridge that allows your website or application to access functionalities and data from other services or systems on the Internet, enhancing its capabilities and providing dynamic and interactive experiences for users.

The method is used to show the widget on the website.

JS API

claspo('showWidget', {formVariantId: 'f(form id)v(variant id)'});

NOTE: You have to copy the JS API containing the actual 'f(form id)v(variant id)' value of your widget. See the Description section below.

Parameters

Parameter	Description
formVariantId	The form ID and the form variant ID of the widget in the f(form id)v(variant id) format.

Description

You have to use the JS API of the actual widget. It is displayed in widget details when you activate the API-based widget triggering.

To copy the JS API:

Go to your Claspo dashboard and select Widgets → Widget triggering.
Enable the API based slide button and click the copy icon beside the script.

Get widget state

The method is used to get the widget state.

JS API

claspo('onWidgetEvents', {formVariantId: 'f(form id)v(variant id)'}, ({type}) => { if( type = 'CONTACT_DATA_SUBMIT') { console.log('contact data submitted'); } })

NOTE: You have to substitute 'f(form id)v(variant id)' in the example with the form ID and the form variant ID of your widget. See the Description section below.

Parameters

Parameter	Description
formVariantId	The form ID and the form variant ID of the widget in the f(form id)v(variant id) format.
CONTACT_DATA_SUBMIT	Widget event. It returns the ‘contact data submitted’ message to the log when a contact entered data in a widget and submitted it.

Description

To use the JS API, you have to substitute the form ID and the form variant ID in the JS API with the actual widget value.

To substitute the form ID and the form variant ID:

Go to your Claspo dashboard and select Widget → Widget triggering → API based → Showing with JavaScript.
Copy the 'f(form id)v(variant id)' value displayed in the Showing with JavaScript section.
Paste the value in the JS API.

The form ID and the variant ID are usually the same. Example: 'f244v244'.