This article explains how you can send Live chat's interactions to Google Ads and mark it as a conversion in your Google Ads account. This tutorial is done with the help of Google Tag Manager (GTM)

We will cover a few examples but regarding Google Ads developper documentation, you'll be able to set a wide variety of use case. Depending on the way you use Crisp, you should be able to create events that will be flagged as conversions in Google Ads.

If you want to have a deeper look at all the events that are built in Crisp Live Chat, you should have a look here.

What you'll need here:
Google Tag Manager account
Google Ads Account

For the sake of this article, we will measure a** conversion as a message sent from the website**. It means, when your lead send a message through the chat.

A message has been sent

This event helps you to monitor how many messages have been sent through Crisp.
For this event, we use the [message:sent]

If you are using Google Tag Manager :

<script type="text/javascript">
  $crisp.push(["on", "message:sent", function(event){ 
    dataLayer.push({
      'event': 'CrispInteractions', 
      'eventCategory': 'chatbox',
      'eventAction': 'message sent'
    });
  }]);
</script>

An email has been set in Crisp user profile

<script type="text/javascript">
  $crisp.push(["on", "user:email:changed", function(event){ 
    dataLayer.push({
      'event': 'CrispInteractions', 
      'eventAction': 'email set'
    });
  }]);
</script>

Keep in mind this script, it is going to be an important one.

Google Tag Manager Tutorial for Google Ads

Step 1: Build an event listener as explained below

Create a custom html tag that contains the code that is supplied above.


At this stage, you are calling a function ($crisp.push) that contains a listener, this listener is supposed to be set website wide.

As you can see in the listener, you are pushing data to the DataLayer (if you don't know what a dataLayer is for GTM, here is a good explanation).

The data Layer is creating an event, which is "CrispInteractions" that we will need later, at step 3.

Step 2 : Create a custom event that triggers step 1 (you would want to use gtm.dom)

What is a custom event in Google Tag Manager?

Google Tag Manager Custom Event is used for tracking interactions that might take place on your website or mobile app that isn’t handled by standard methods.

To what refers gtm.click and gtm.dom?

gtm.click refers to any mouse click that is done on your website. If you're going with gtm.click, it means that your listener will be triggered on a mouse click (eg. when a user click on the chatbox to open it).
gtm.dom refers to the website and will trigger the listener when the website is fully loaded.

It may happen that gtm.click is not working, simply change to gtm.dom and it should work properly :)

Step 3 : Create the custom event for CrispInteractions



In this tutorial we're using a custom event because we just created an event that is specific to our need.

"CrispInteractions" is created through the dataLayer.push at step 1.

If you want to know more about this function, here is a good explanation.

This custom event is only triggered when a message is sent because you're using the $crisp.push method that looks for message sent.

Step 4 : Link the custom event (CrispInteractions) with a Google Ads conversion that will send the right data to your Google Ads account.



Note that if you don't have the Conversion Linker Tag enabled on your GTM container, you'll have to do so. It's super easy to be done, simply hit the button "create"



Now, you should be at this step:



You have to set the following inputs:
Conversion ID
Conversion Label
Conversion Value

You can get these informations in your Google Ads Account. Here is the process:
Go to ads.google.com and login to your account
Click on the tools and settings as per shown in the screenshot below



Click on an existing conversion or create a new one if you need to.
On "tag configuration" click on "Use with Google Tag Manager" so you can find the mandatory information.

Beware for my friends under the GDPR regulation, by using this technique, you're assigning a new cookie that needs to be declared and accepted by the website visitor.



Last but not least, link the CrispInteractions Event to the Gads tag, hit save and publish your workspace modifications. Don't forget to try it before you push it live ;)

Updated on: 06/08/2024