Tracker
Tracking Code Setup

Tracking Code Setup

A simple, copy-paste guide to get the Customerscore tracker running on any website. Includes Google Tag Manager instructions and testing tips.

Prerequisites

Install the Loader Script

Place this exact snippet in your site's <head> (before other scripts if possible). It safely queues calls until the library loads.

<script type="text/javascript">
  (function (t) {
    typeof define == "function" && define.amd ? define(t) : t();
  })(function () {
    "use strict";
    (function () {
      var t = "CustomerScoreTracker",
        i = window,
        n = [],
        s = i[t] || {};
      s.__stub__ = !0;
      function d(e) {
        s[e] = function () {
          n.push({ name: e, args: Array.prototype.slice.call(arguments) });
        };
      }
      for (
        var f = [
            "init",
            "identify",
            "resetIdentity",
            "track",
            "pageView",
            "group",
            "set",
            "unset",
            "setOnce",
            "config",
            "eventStart",
          ],
          o = 0;
        o < f.length;
        o++
      )
        d(f[o]);
      i[t] = s;
      function l() {
        var e = i[t];
        if (e && !e.__stub__) {
          for (var u = 0; u < n.length; u++) {
            var c = n[u];
            typeof e[c.name] == "function" && e[c.name].apply(e, c.args);
          }
          n = [];
        }
      }
      var h = document.createElement("script");
      h.src = "https://cdn.customerscore.io/tracker/tracker.min.js";
      h.async = !0;
      h.onload = l;
      document.head.appendChild(h);
    })();
  });
</script>

This defines a window.CustomerScoreTracker stub that buffers calls (e.g., init, track) until the hosted library finishes loading.

Initialize the Tracker

Add one of the following right after the opening <body> tag or in your app's startup code (e.g., DOM ready, app bootstrap).

Minimal

<script>
  CustomerScoreTracker.init("CS-123456");
</script>

With Configuration

<script>
  CustomerScoreTracker.init("CS-123456", {
    // config options
  });
</script>

Call init exactly once per page/app load and before any identify or track calls.

Identify the Logged-in User

Call as soon as you know who the user is. customer is required; contact is optional.

<script>
  CustomerScoreTracker.identify({
    customer: { id: "cust-23749" }, // required – your external customer ID
    contact: { id: "thomas@example.com" }, // optional – your external contact ID or email
  });
</script>

Alternatively, you can specify contact as an object with extra data:

<script>
  CustomerScoreTracker.identify({
    customer: { id: "cust-23749" },
    contact: {
      id: "thomas@example.com",
      contact_name: "Thomas Doe", // "contact_name" is reserved property
      birth_date: "1999-01-01", // value will be stored to a corresponding property on contact
    },
  });
</script>

Call identify immediately after a successful login or when the user context becomes available. Re-call if the logged-in user changes.

Track Custom Events

Use this for button clicks, feature usage, or milestones.

<script>
  CustomerScoreTracker.track("my_event");
</script>
  • my_event should correspond to a metric/attribute key you've defined in the Customerscore app (but any string is accepted)
  • You can call this anywhere in your code (after init)

You can also include extra data with the track method:

<script>
  CustomerScoreTracker.track("my_event", {
    contact: {
      contact_name: "Thomas Doe",
      birth_date: "1999-01-01",
    },
  });
</script>

Data sent this way will be added to the identified contact.

Track Page Views

Page views can be captured automatically by using the autocapture config option within CustomerScoreTracker.init().

Autocapture

Choose the mode that fits your site:

  • "hard-navigation" — traditional sites where page loads cause full reloads
  • "soft-navigation" — single-page apps (SPAs) where the URL changes without a full reload
  • true — enable general autocapture behavior
<script>
  CustomerScoreTracker.init("CS-123456", {
    autocapture: {
      pageview: "hard-navigation", // or "soft-navigation" or true
    },
  });
</script>

Or simply:

<script>
  CustomerScoreTracker.init("CS-123456", { autocapture: true });
</script>

If the autocapture configuration option is not specified, page views are not captured by default.

Explicit Page View

If you disabled autocapture or need explicit control (e.g., on SPA route changes), call:

<script>
  CustomerScoreTracker.pageView();
</script>

For SPAs, call pageView() on every route change if you're not using autocapture with soft-navigation.

Reset Identity on Logout

Clear the current user's identity when they log out.

<script>
  CustomerScoreTracker.resetIdentity();
</script>

Google Tag Manager (GTM) Setup

You can deploy the same code via GTM.

A. Loader Tag

  1. Create Tag → Custom HTML
  2. Paste the loader snippet from the Install section (including <script>...</script>)
  3. Trigger: All Pages (Page View – All Pages)
  4. Save & Publish

B. Init Tag

  1. Create another Tag → Custom HTML
  2. Trigger: DOM Ready (or Window Loaded), All Pages
  3. Set Tag Sequencing (optional): fire after the Loader tag

Paste:

<script>
  CustomerScoreTracker.init("CS-123456", { autocapture: true });
</script>

C. Identify / Events

For custom events, create GTM triggers (e.g., clicks) that run:

<script>
  CustomerScoreTracker.track("my_event");
</script>

Fire additional Custom HTML tags on your login success trigger or button click triggers:

<script>
  CustomerScoreTracker.identify({
    customer: { id: "{{User Id}}" },
    contact: { id: "{{User Email}}" },
  });
</script>

Test & Verify

  1. Open your site → DevTools Console

If autocapture is off in an SPA, navigate and call:

CustomerScoreTracker.pageView();

Send a test event:

CustomerScoreTracker.track("test_event");

Verify the library loaded:

window.CustomerScoreTracker && typeof CustomerScoreTracker.init === "function";

Should return true after the library loads.

Common Pitfalls

  • Missing init — Always call CustomerScoreTracker.init(...) before identify/track/pageView
  • Identify timing — Call identify after login and whenever the active user changes
  • SPA page views — If you don't use autocapture with soft-navigation, call pageView() on every route change
  • Caching/CDN — Ensure the loader snippet is not stripped by your templating/CDN

Next Steps

Now it's time to configure metrics and attributes if not done already. This is crucial for visibility of tracked events within your customer's data.

Read the Metrics & Attributes Setup guide or navigate to Settings → Tracker, section "Setup Metrics and Attributes" in the Customerscore app (opens in a new tab).