Client Tracking

Integrate Userlike with your website tracking solution

If you’re already using a tracking solution for your website, you can integrate it with Userlike and track Userlike-specific events.

Provide a JavaScript callback function and Userlike’s chat client will send relevant tracking events.

Define a function named userlikeTrackingEvent to receive the events. In your function you need to implement a specific tracking call to your tracking system.

Before you start

💡

Due to limitations of client based tracking (e.g. ad blockers) the data cannot be compared to our backend based solution Userlike Analytics.This is an advanced feature, which needs to be implemented by your development team.

javascript
<!DOCTYPE html>
<html lang="en-us">
    <head>
        <meta charset="utf-8">
        <title>Userlike</title>
    </head>
<body>
</body>
<script>

userlikeTrackingEvent = function (event_name, global_ctx, session_ctx) {
        console.log("userlikeTrackingEvent: name=%s global_ctx=%o session_ctx=%o",
            event_name,
            global_ctx,
            session_ctx
        );
};
</script>
<script type="text/javascript" src="{{javascript_loader_url}}"></script>
</html>

Event names

💡

For technical reasons, the events listed below may differ in terms of how they are triggered from similarly named events and KPIs in Userlike’s native tracking Analytics. A direct comparison of statistics between your solution and Analytics may therefore provide an inconsistent picture.

The function argument string “event_name” can have the following values.

Event	Description
`button_displayed`	Chat button was displayed to contact on your website
`chat_connected`	Website Messenger connected to Userlike server after contact sent a first message
`chat_connected_proactive`	Website Messenger connected to Userlike server after contact sent a first message in Proactive Mode
`chat_requested`	Conversation initiated by Userlike system after contact clicked the button to start a new conversation
`chat_started`	Conversation started after contact clicked the button to start or continue a conversation
`chat_started_proactive`	Conversation started in Proactive Mode after contact clicked the button to start a new conversation
`chat_window_maximized`	Contact maximized the Website Messenger by clicking the chat button or by clicking the button to start or continue a conversation
`chat_window_minimized`	Contact minimized the Website Messenger
`contact_first_message`	First message sent by contact
`disclaimer_ok`	Contact accepted data privacy notice
`error_message`	Error message displayed to contact
`feedback_rating_show`	Feedback & rating screen displayed to contact
`feedback_submit`	Contact submitted feedback
`group_select_show`	Group Select screen displayed to contact
`group_select_submit`	Contact selected operator group, Website Messenger connected to Userlike server
`message_client_terminating`	Operator sent message to contact or set the conversation to “ended”
`message_operator_terminating`	Contact sent message to operator
`post_survey_show`	Post-conversation survey was displayed to contact
`post_survey_submit`	Post-conversation survey was answered and submitted by contact
`pre_survey_show`	Pre-conversation survey was displayed to contact
`pre_survey_submit`	Pre-conversation survey was answered and submitted by contact
`proactive_offer`	Website Messenger opened after proactive timer has run down
`proactive_timer`	Proactive timer started as contact opened the page
`rating_submit`	Contact submitted a rating
`register_cancel`	Contact skipped the registration screen
`register_show`	Registration screen was displayed to contact
`register_submit`	Registration was filled out and submitted by contact
`slot_available`	Userlike checked for free chat slots among allocated operator group and found one
`slot_unavailable`	Userlike checked for free chat slots among allocated operator group and found none
`transcript_cancel`	Contact left the transcript screen or closed the Website Messenger without requesting a transcript
`transcript_show`	Contact opened the transcript screen
`transcript_submit`	Contact requested a transcript by submitting their email address

Global context

The function argument “global_ctx” is a JavaScript object that will have the following values:

Name	Type	Description	Optional
`client_uuid`	String	Unique ID of the contact
`operator_group_id`	Integer	ID of the operator group connected to the Widget
`widget_id`	Integer	ID of the Widget
`widget_lang`	String	ISO 639-1 language code of the current Widget

Session context

The function argument “session_ctx” is a JavaScript object that will have the following values. Depending on the state and configuration of your Widget, values will be defined or undefined.

Name	Type	Description	Optional
`session_id`	String	Session ID per browser session
`chat_id`	String	Chat ID which relates to the chat transcripts
`client_name`	String	Name of the contact
`client_email`	String	Email of the contact
`operator_id`	Integer	Operator ID of the current chat session
`operator_name`	String	Operator name of the current chat session
`custom_data`	Object	Your currently assigned custom data

Sample code

Here is sample using Google Analytics as a tracking backend.

javascript
<!DOCTYPE html>
<html lang="en-us">
    <head>
        <meta charset="utf-8">
        <title>Userlike</title>
    </head>
<body>
</body>
<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-Y']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'https://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
}) ();

userlikeTrackingEvent = function (event_name, global_ctx, session_ctx) {
    console.log("userlikeTrackingEvent: name=%s global_ctx=%o session_ctx=%o",
        event_name,
        global_ctx,
        session_ctx
        );
    _gaq.push([
        '_trackEvent',
        'Userlike_Chat',
        event_name,
        'Operator_' + session_ctx.operator_name
    ]);

};
</script>
<script type="text/javascript" src="{{javascript_loader_url}}"></script>
</html>