Skip to main content

Integrate Tracking

LoyJoy emits events for every meaningful chat interaction (open, sign-up, link clicked, and many more). This page shows how to forward those events to Google Analytics, Google Tag Manager, or your own JavaScript.

Tracking is optional and only runs once the customer has accepted the relevant cookie categories. Before enabling it, review the Cookie Banner Integration guide so the LoyJoy snippet and your consent manager interact correctly.

In the Publish tab of your agent, choose whether to forward events to Google Analytics, Google Tag Manager, or a custom script. The selection runs whenever an event is emitted.

How to Connect LoyJoy to Google Global Site Tag / Google Analytics (gtag.js)​

When you select Google Analytics, the following script will automatically be executed on each LoyJoy event:

gtag && gtag('event', type, {
  'event_category': 'LoyJoy Chat',
  'event_action': detail && detail.process_name,
  'event_label': type + (detail.label ? '/' + detail.label : '')
})

How to Connect LoyJoy to Google Tag Manager (gtm.js)​

When you select Google Tag Manager, the following script will automatically be executed on each LoyJoy event:

dataLayer && dataLayer.push && dataLayer.push({
  'event': type,
  'event_category': 'LoyJoy Chat',
  'event_action': detail && detail.process_name,
  'event_label': type + (detail.label ? '/' + detail.label : '')
})
note

With the default Google Tag Manager integration, the saved events will have the following fields:

FieldContents
eventEvent name / type. E.g. session_started. See here
event_categoryFixed, always LoyJoy Chat
event_actionName of the agent
event_labelEvent name + optional label, e.g. quick reply title

Custom JavaScript Code​

When you select Custom, you can enter custom JavaScript code, which should be executed on each LoyJoy event, e.g.:

if ([
  'data_collection_question_answered', 'interaction', 'link_clicked', 'load', 'open', 'session_interacted', 'session_started', 'start'
].includes(event.type)) {
  dataLayer && dataLayer.push && dataLayer.push({
    'event': 'LoyJoy ChatBot ' + event.type,
    'event_category': 'LoyJoy ChatBot',
    'event_action': ['load', 'session_interacted', 'session_started'].includes(event.type) ? event.type : event.detail && (event.detail.process_name || event.detail.process_id),
    'event_label': ['load', 'session_interacted', 'session_started'].includes(event.type) ? event.type : event.type + (event.detail && event.detail.label ? ' / '  + event.detail.label : '') + (event.detail && (event.detail.sub_process_name || event.detail.sub_process_id) ? ' / ' + (event.detail.sub_process_name || event.detail.sub_process_id) : '')
  })
}

Facebook Pixel / Meta Pixel​

A Facebook / Meta pixel integration could look like this:

if (event.type === 'link_clicked') {
  fbq('track', 'Lead', { process: event.detail.process_name });
}

Typically, you might want to adjust the event type being checked for (here link_clicked) as well as the tracked event you send to Facebook (here Lead).

link_clicked events contain the url field in their detail property, which you can use to track clicked links. For example, if you want to track when a user clicks a link in the chat, you could use the following code:

if (event.type === 'link_clicked') {
  dataLayer && dataLayer.push && dataLayer.push({
    'event': 'LoyJoy ChatBot Link Clicked',
    'event_category': 'LoyJoy ChatBot',
    'event_action': 'Link Clicked',
    'event_label': event.detail.url
  })
}