In addition to measuring success in the moinAI Hub, interactions of website visitors with the AI chatbot can be included in existing analyses, e.g. of the customer journey on the website.
How often is the widget opened? Which buttons do users click most during the conversation - Quick Replies, the map menu or links? How often did users type something into the text field yesterday? All these questions and more can be explored using the client-side interface (API).
The presentation of the data depends on which tool is used to evaluate user behaviour. Possible tools for this are, for example, Mixpanel, Google Analytics or Adobe Analytics. To get started, only a few lines of code need to be integrated. This works quickly and easily, e.g. with the Google Tag Manager.
Technical documentation
For tracking user interactions in Google Analytics, suitable events are already available in the client-side interface, which can be used in Google Analytics, for example. With the help of these events, interactions can be tracked.
The moinAI chat widget sends the following events (incl. sample code). This information is also available in the technical documentation.
widget.interaction
- widget open / close state
- teaser interactions: Teaser close, click on teaser buttons
{"event_type":"widget.interaction","source":"teaser","action":"button_click","text":"Frage stellen"}{"event_type":"widget.interaction","source":"teaser","action":"close_teaser"}
user.click
clicks on conversation items
- buttonlist links
- card buttons
- quick replies
{"event_type":"user.click","source":"quickreplies","text":"Rufnummernmitnahme"}
user.input
- user input message text
{"event_type":"user.input","message":{"message":"test"}}
It is possible to use the sample code in the GA test environment and then interact with the chatbot there to see what events are triggered.
Here is the code that can be used to listen to or register for the events mentioned above:
<script>
window.chatWidgetReady = function() {
console.log('chatWidgetReady function');
window.knowhere.api.on('widget.interaction', function (data) {
console.log('CUSTOMER EVENT WIDGET HANDLER', data)
})
window.knowhere.api.on('user.click', function (data) {
console.log('CUSTOMER EVENT CLICK HANDLER', data)
})
window.knowhere.api.on('user.input', function (data) {
console.log('CUSTOMER EVENT INPUT HANDLER', data)
})
}
</script>
Example
Perform an action for each user click (button, quickreply):
Read more in the Google Analytics documentation.
<script>
window.chatWidgetReady = function() {
window.knowhere.api.on('user.click', function(data) {
// HIER TRACKING EINFÜGEN
// z.B. Google Analytics, angenommen chatbot-click ist definiert:
// ga('send', 'chatbot-click');
})
}
</script>
Note on the use of multiple API functions
The chatWidgetReady function cannot be called multiple times. When using multiple API functions such as client-side tracking & widget teaser, an overall script must be integrated:
<script>
window.chatWidgetReady = function() {
console.log('chatWidgetReady function');
window.knowhere.api.on('widget.interaction', function (data) {
console.log('CUSTOMER EVENT WIDGET HANDLER', data)
})
window.knowhere.api.on('user.click', function (data) {
console.log('CUSTOMER EVENT CLICK HANDLER', data)
})
window.knowhere.api.on('user.input', function (data) {
console.log('CUSTOMER EVENT INPUT HANDLER', data)
})
window.knowhere.api.teaser({
showTeaser: true,
showAvatar: true,
message: 'Wie kann ich Dir helfen?',
quickActions: [{
text: 'Frage stellen',
intent: 'start'
},
{
text: 'Beispielthema',
intent: 'faq_beispielthema'
}
],
timeout: 2000
});
}
</script>