Sending events from Joonbot to Google Analytics is easy.

For that, you can use Google functions in our Javascript blocks.

You have two ways to send events to Google Analytics. You can use:

• Google Analytics functions
• Google Tag Manager Data Layer

⚠️ This tutorial works only for embedded chatbots in your website: widget format or embed format. It's not working with full-page format.

Send events directly to Google Analytics

First, you need to have Google Analytics installed directly into your website (not through GTM).

With Google Universal Analytics

1. Check that you have Google Universal Analytics installed on your website (UA-XXX).

2. Add a Javascript block to your chatbot conversational path.

3. Insert in your JS block the following code with your own properties.

window.ga('send', 'event','Category','Action','Label');

In the example below, we wanted to send an event to Google Analytics every time a conversation with our home page chatbot starts.

Here is our code:

window.ga('send', 'event','Chatbot','Conversation Started','Home page chatbot');

4. Finally, talk with your chatbot until your JS block is reached. You'll be able to see your events in your Google Analytics like us.

If you don't see your event in Google Analytics, check your inspector as we did below.

To get to know more about Google Analytics events, you can check the Google Developers documentation.

With Google Analytics 4

1. Check that you have Google Analytics 4 installed on your website.

2. Add a Javascript block to your chatbot conversational path.

3. Insert in your JS block the following code with your own properties.

window.gtag('event', 'login', {
'method': 'Google'
});

For example, to send an event to Google Analytics every time someone starts a conversation with our home page chatbot, we wrote this code:

window.gtag('event','Conversation Started');

4. Finally, talk with your chatbot until your JS block is reached. You'll be able to see your events in your GA4.

To get to know more about Google Analytics events, you can have a look at the Google Developers documentation.

Send events through Google Tag Manager

1. Check that you have Google Tag Manager installed on your website.

2. Add a Javascript block to your chatbot conversational path.

3. Insert in your JS block the following code with your own properties.

window.dataLayer.push({ 
'event' : 'pageview',
'loginStatus' : 'logged in',
'pageType' : 'product details page'
})

In the example below, we wanted to send an event every time someone starts a conversation with our home page chatbot. So we wrote this code:

window.dataLayer.push({ 
'event' : 'home_bot_started_conversation',
})

4. Create a 'Custom Event' trigger in GTM.

5. Create a 'GA4 event' tag in GTM that is triggered by the custom event you just created.

6. Talk with your chatbot until your Javascript block is reached. You'll see your event in Google Analytics as we did: 

To get to know more about GTM events, you can have a look at the Google Developers documentation.