Tracking Setup: Distil Tracking Code

The Code

We've already written the code snippet for you, so you can just copy and paste it. The code is in Settings > Tracking > JS Bespoke tab. The script includes a unique 32-character identifier for your Distil Account, so take care not to modify this value.

Where To Put the Code

We recommend that the JavaScript code is inserted into the Head section of the HTML within each page on your website. This means that Distil Tracking will be initialised as soon as the page is loaded.

Alternatively, the JavaScript code can be included in the Body section. However, if users click away from the page before the JavaScript code initialises Distil Tracking, then this may result in some Tracking data being lost.

Adding the JavaScript Tracking code is straightforward if you're using a Content Management System (CMS) such as Wordpress, Squarespace, Magnolia or Weebly. Search online for instructions for your specific CMS.

Using the Code

Once the Tracking code is on a web page as described above, capturing Tracking data is a matter of calling the correct tracking event function at the correct time. The section below explains how to use the various functions, including the properties that they return.

Context Object

In addition to returning the properties of the called function, the JavaScript Tracking code will also automatically capture additional contextual information. This information includes the page that the user is on, their IP address, the referring URL and the time of the event. These pieces of information are stored in the Context object.

Here's an example of the Context object:

The JavaScript Tracking code will automatically create a unique identifier called AnonymousUserID for each user visiting the site, and store this information in the browser's local storage (Distil does not use cookies). You can see this ID in the example object above. The same ID will be used to identify the user each time they visit, ensuring that the entirety of their behaviour is tracked and tied to a single Customer: from a first anonymous visit through to multiple purchases. For more information, read our article on how Distil identifies Customers.

Data Types

The following are the data types that are accepted by the Distil JavaScript Tracking code, in the JSON object property blocks.

Add Distil Event Tracking Calls

The following event functions are available in the Distil Tracking code:

• Identify Customer
• Track Product
• Track Content
• Track Order
• Track Event

Identify Customer

When a user is browsing the site, their browsing history is tied to their AnonymousUserID. When this user identifies themselves explicitly by logging in or filling in a form with personal details, Distil captures this identifying information via the identifyCustomer event function, and ties it to that person's browsing history via their AnonymousUserID (for more information, read our article on how Distil identifies Customers).

The identifyCustomer event function needs to be added to all pages where visitors identify themselves by logging in or filling in a form with personal details.

When this event function is called, the Distil Tracking code will also automatically pass a Context object as explained in the section above.

Call the event function:

Pass the following argument to the function:

CustomerProperties Object properties

Note that when customerProperties is used as part of the identifyCustomer event function, the first three properties are mandatory. When this object is used within other functions (see below), then either of the first two properties are mandatory (one or the other). 

GDPRStatus Object properties

Note that some of the properties of GDPRStatus are mandatory.

PostalAddress Object properties

Examples

Examples of a call with only mandatory fields:

1. With Customer ID

2. With Email Address

3. Or With Both CustomerID and Email Address

Track Product

When a user views a single product page on the website, this information can be captured using the trackProduct event function, which needs to be added to all pages where this type of activity occurs.

When this event function is called, the Distil Tracking code will also automatically pass a Context object as explained in the section above.

Call the event function:

Pass the following arguments to the function:

ProductProperties Object properties

Note that some of the properties of ProductProperties are mandatory.

Examples

Example of call with only mandatory fields:

The customer property is not passed in the above as it is not mandatory.

Example of call with Customer Properties included:

Track Content

When a user views a Content page on the website, this information can be captured using the trackContent event function, which needs to be added to all pages where this type of activity occurs.

When this event function is called, the Distil Tracking code will also automatically pass a Context object as explained in the section above.

Call the event function:

Pass the following arguments to the function:

ContentProperties Object properties

Note that some of the properties of contentProperties are mandatory.

Examples

Example of call with only mandatory fields:

The customer property is not passed in the above as it is not mandatory.

Example of call with Customer Properties included:

Track Order

When a user places an order on the website, this information is captured using the trackOrder event, which needs to be added to all pages where this type of activity occurs.

When this event function is called, the Distil Tracking code will also automatically pass a Context object as explained in the section above.

Call the event function:

Pass the following arguments to the function:

OrderProperties Object properties

Note that some of the properties of orderProperties are mandatory.

OrderLineItems Object Properties

Note that some of the properties of orderLineItems are mandatory.

BillingAddress and DeliveryAddress Object properties

Examples

Example of call with only mandatory fields

Track Event

Sometimes you may wish to capture data on an event that doesn't fit into the standard Distil event functions described above. Distil supports custom Tracking data capture through the trackEvent event function.

Call the event function:

Pass the following arguments to the function:

EventCustomProperties Object properties

As this event function records a custom event, this object contains only custom properties. The object must contain at least one property. Replace the Property Names (e.g. Property1) with your own custom names.