Listening to widget events
Overview:
You’re installing Consolto and want to listen to events on the widget. Yep, you’ve come to the right place.
In general, we try to send information that reflects the way users use the widget on your site. In case you think there’s a missing event - please let us know!
We dispatch a custom event on the "window" with an event named "consoltoEvent". An object with the following details is attached to that event:
- category: "CONSOLTO_WIDGET"
- Action: one of the actions below
Available actions:
- SEND_BOOKING_REQUEST: Triggers when a customer has submitted an appointment request.
- OPEN_PRE_WIDGET: Triggers when the small widget is clicked.
- OPEN_WIDGET: Triggers when an agent’s widget is clicked.
- CLOSE_WIDGET: Triggers when an agent’s widget is closed.
- CLOSE_ACCOUNT_WIDGET: Triggers when the account-widget is closed.
- SEND_FB_MESSAGE: Triggers when a customer clicks the Facebook Messenger button.
- SEND_WHATSAPP_MESSAGE: Triggers when a customer clicks the WhatsApp button.
- MESSAGE_TO_MENTOR: Triggers when a customer submits a contact form.
- PHONE_CALL: Triggers when a customer clicks the phone call button.
- OPEN_CHAT: Triggers every time a chat is initialized.
- CALL_STARTED_CLIENT: Triggers when a web conferencing call is accepted and starts.
- CALL_ENDED_CLIENT: Triggers when a web conferencing call ends.
- CHAT_MESSAGE_RECEIVED: Triggers every time a chat message arrives from the agent/host.
- CHAT_MESSAGE_SENT: Triggers every time a customer sends a chat message to the agent/host.
- AVAILABILITY_STATE_CHANGE: Triggers every time agents shift between offline, available and busy.
Instructions:
IMPORTANT: Make sure the switch related to sending API events to the hosting website is turned ON (availability based on plan).
If you're using a Team Widget, this switch will be located at: Team Center ==> Integrations ==> Website API Calls.
In the Single-agent plugin, this switch will be located at: Widget Center ==> Integrations ==> Website API Calls.
Sending API events to the hosting website
Listening to events sent by Consolto:
Example:
In your website - capture the events:
<script>
window.addEventListener('consoltoEvent', function (e) {
console.debug(e.detail);
});
</script>
Response example:
{
action: "OPEN_PRE_WIDGET"
category: "CONSOLTO_WIDGET"
label: "5c30e893a81e5121feb1b52a"
value: ""
}