Skip to main content

Chatlio GTM Event Listener

Track Chatlio Slack-integrated chat widget interactions in GTM. Monitor open, close, messages, and offline events with chatlio_action variable.

chatlioslackchatgtmga4supportdeveloper-tools

Event fired

chatlio_event

Key variable

chatlio_action

Chatlio

Overview

Chatlio integrates with Slack, routing chat conversations directly to Slack channels. This listener hooks into Chatlio's JavaScript API to track widget interactions and conversation events.

Event fired: chatlio_event Variable: chatlio_action

Tracked Events

chatlio_actionDescription
widget openedChat expands
widget closedChat collapses
conversation startedFirst message sent
message sentVisitor sends message
message receivedSlack agent replies
offline form submittedOffline contact form
feedback submittedPost-chat feedback

Installation

html
<!-- GTM Custom HTML Tag: Chatlio Listener -->
<script>
(function() {
  function chatlioPush(action, extra) {
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push(Object.assign({
      'event': 'chatlio_event',
      'chatlio_action': action
    }, extra || {}));
  }

  document.addEventListener('chatlio.ready', function() {
    document.addEventListener('chatlio.expanded', function() { chatlioPush('widget opened'); });
    document.addEventListener('chatlio.collapsed', function() { chatlioPush('widget closed'); });
    document.addEventListener('chatlio.conversationStarted', function() {
      chatlioPush('conversation started');
    });
    document.addEventListener('chatlio.messageSent', function(e) {
      chatlioPush('message sent', { messageContent: e.detail && e.detail.text });
    });
    document.addEventListener('chatlio.messageReceived', function(e) {
      chatlioPush('message received');
    });
    document.addEventListener('chatlio.offlineMessageSent', function() {
      chatlioPush('offline form submitted');
    });
  });
})();
</script>

Data Layer Output

json
{
  "event": "chatlio_event",
  "chatlio_action": "conversation started"
}

Trigger Configuration

Trigger Type: Custom Event Event Name: chatlio_event

GA4 Mapping

GA4 EventConditionParameters
chat_widget_openchatlio_action = widget openedchat_platform: "chatlio"

Related Listeners