The Cooladata JavaScript Tracker gives you full control over events sent from your website, by defining default setting (init), sending custom events, and more advanced options.

Initialization

The init function initializes a new instance of the CooladataTracker object.
To start tracking with Cooladata JavaScript Tracker, add the following code to the header of each page you want to track (between the <head> and the </head> tags) and replace the app key with your own:

Note: on WordPress sites, add the snippet in the header.php file. It can usually be found in the wp-admin under appearance -> Editor -> theme header(header.php).

The above setup includes the recommended implementation options:

  • Track page views automatically
  • Uses a tracking pixel

The following table includes all configuration options:

ParameterTypeMandatoryDefaultDescription
app_keyStringYesThe specific project app key provided by CoolaData
http_postBooleanNoFalseUse HTTP POST method instead of the default GET method
img_src_get_requestBooleanNoFalseSend an image (1x1 pixel) as GET request for XHR requests
disable_cookieBooleanNoFalseDisables cookie creation on the user browser when tracking an event. When true, the user ID sent by CoolaData will change with every page load, and user identification management will be dependent on the user ID sent in the event tracker ("user_id" in the tracker, "customer_user_id" in CQL).
api_hostStringNoapi.cooladata.comReplace the default API domain with a custom domain as the tracker endpoint. For example: "api_host":"tracking.com" will be sent to: http://tracking.com/v1/ [app_key]/track
track_pageload*BooleanNoFalseSend page_load event automatically every time a user views the page.
Sent with the following properties: page_url, page_url_params, page_title.
user_idStringNoFalseSpecify the user_id on the page's cooladata tracker init to associate all events (including track_pageload) to the current user.
izzyClickBooleanNoFalseAllows to use the CoolaData Tagger tracker to visually manage your events.

* Note: The track_pageload parameter is sent together with the user_id. If no user_id was explicitly specified in the cooladata.init() function, a random user_id will be generated and used for each event. Pay attention that if you DON’T send a user_id in the init function but send one in the cooladata.trackEvent() both random and custom user_ids will not be associated with each other.

Track Custom Events

Once you have the Tracker snippet in your page, you can track an event by calling cooladata.trackEvent(); with the event name and its properties:

How to use:

The function is built of a few parts:

  • The function call: cooladata.trackEvent()
  • The event name
  • The properties & their values a JSON. The JSON must be “flat” so you can’t use any nested JSON.

Example:

Each event can include properties. For example, the above ‘Add Item‘ event includes the item type, number of items, and the purchaser’s email address. Read more about properties.

You could also use JQuery to send an event to the Cooladata server. In this example a function is called when a form’s SEND button is clicked (this example uses ninja forms). JQuery is used here to extract the data from the differentn form’s fields.

In the table below you can find all cooladata.trackEvent() elements (some are optional):

ParameterTypeMandatoryDescription
eventNameStringYesThe name of the event to report.
eventPropertiesObjectNoObject containing all additional properties in format: "property_name":"property_value". See example below.
user_idStringNoSend if you want to be able to identify users according to your definition for user ID. For example: use this for cross-platform identification where users perform a log-in action.
event_timestamp_epochNumberYes**Must be sent if the project is NOT set to override event time-stamp with server time.
Format is milliseconds (13 digits) only. If the project is defined to override event time-stamp with server time, any time-stamp sent with the event will be ignored.
custom propertiesString/NumberNoAny additional properties mapped in the project. See more information in Managing Properties.

Use a callback function

In some cases, after sending an event to the server, you would want to execute some code on the Browser. This can be easily done by adding a callback function to your cooladata.trackEvent() call.

The process works as follows: Tracker sends event to Cooladata server -> Cooladata server sends OK response to Tracker -> callback function is executed.

How to use:

Example:

Track a bulk of events

The cooladata.trackEventLater() method provides the ability to track a bulk of events. All events will be stored on a local queue until the cooladata.flush() method is called. This method can be useful when you want to submit more than one event at a time, for example to send a list of events that are linked together all in a single request, instead of multiple requests.

Example:

1. Add an event to the queue:

2. Add a second event to the queue:

3. Send the events to the Cooladata server

Print Friendly, PDF & Email