The javascript library/ SDK is designed to measure browser activity. With this technology you can send (write) any action or event in your web app or website. The Opentracker javascript contains functions and listeners that facilitate the insertion of events into Opentracker's events engine.
You will need to take a trial to start using the javascript. You will receive an email with installation instructions.
The received script will look something like this (the site parameter will differ per site):
<script src="//script.opentracker.net/?site=api.opentracker.net"></script>
This javascript will load into the browser and execute and collect data and send it to Opentracker's logging servers (log.opentracker.net).
Under certain circumstances, you might not want to send the event after the page loads. You can add parameters to the script to manipulate its behavior. To make the Opentracker javascript not collect any data on page-load you can add the onload=false option:
<!-- OPENTRACKER HTML START --> <script src="//script.opentracker.net/?site=mysite.com&onload=false"></script> <!-- OPENTRACKER HTML END -->
Frequently you want the script to collect default data (for instance screen colors, browser, etc.) but wait before sending the data to the logging servers. The following script shows how to turn off the default behavior, setup the data for sending, manipulate the data, and then send it. This will enable you to add extra data and trigger the sending of the data at a later stage. The script will define a variable (_otmap) with all data already filled. The following example illustrates a use case for segments:
<!-- OPENTRACKER HTML START --> <script src="//script.opentracker.net/?site=mysite.com&onload=map"></script> <!-- OPENTRACKER HTML END --> <script> _otmap.put("salesChannel!", "West coast ads"); // define a variable called salesChannel, which is a segment (!) OTLogService.sendEvent(_otmap); // send the map </script>
notice the ! after the property-name, this needs to be added to make a property a segment. The OTLogService.sendEvent() method is called to send events. This can have several forms:
<!-- OPENTRACKER HTML START --> <script src="//script.opentracker.net/?site=mysite.com"></script> <!-- OPENTRACKER HTML END --> <script> _otmap.put("salesChannel!", "West coast ads"); // define a segment (!) called salesChannel OTLogService.sendEvent(_otmap); // send the preloaded (_otmap) OTLogService.sendEvent("Just a simple event"); // send a title event OTLogService.sendEvent("Just a simple event", _otmap); // send a title and a map OTLogService.sendEvent("Just a simple event", _otmap, false); // send a title and a map, don't update the session state </script>
The above script actually sends five events. Once when the page loads, and four coded events. Sending events will be discussed further underneath.
Send us a basic event with this javascript call:
<script type="text/javascript" src="//script.opentracker.net/?site=api.opentracker.net"></script> <script> OTLogService.sendEvent("your event title") </script>
This will add an event to user's session with a clickstream title, ti
: your event title
You can add this anywhere you like. In this example, a button is pressed on a form:
<input type="button" id="myButton" value="myButton label" onclick='OTLogService.sendEvent("myButton was clicked")' />
If you decide to give no title for a event, the following can be done:
OTLogService.sendEvent("", map, false);
OTLogService.sendEvent(undefined, map, false);
both give a line in the event stream with title: NO TITLE
By default, sending a javascript event always sends a title. Adding events with more properties is very straightforward. Simply add the properties you wish to submit by using Opentracker's map javascript object:
map.put
insert event into an object (map) as a property name/ value pair.
map.get
read a previous value set with map.put
map.clear
used to clear a map's data
map.remove
use to remove specific property from a map
Once your map has been defined, you can send it to us with a simple javascript function:
OTLogService.sendEvent("your event title", map);
: This function will send (submit) the data to our log servers.
var map = new OTMap(); map.put("name", "Brad Shaw"); map.put("email", "bshaw@domain.com"); OTLogService.sendEvent("User signup", map);
There are pre-defined properties that trigger certain behavior in a) the way an event is processed and b) displayed in the reporting interface. For example, the property called "email" will add the value of that property to clickstream user-profiles and appear in the Top Emails report, which is a list of all known email addresses on your site or app.
The state of a session/ user includes information on how many pages have been viewed and when the last activity took place. Sending events to Opentracker's events engine with javascript automatically updates the state of the session and the users with the OTLogService.sendEvent() function. The state is updated in the user interface for the user and the sessions. In most cases this is what you want, the sendEvent() function will automatically update a cookie holding state information, in the same way a normal page-view does.
For some events you may want to turn off this default functionality, which is accomplished by adding a false value to the OTLogService.sendEvent() function:
OTLogService.sendEvent("title", map, false);
Opentracker's events engine includes counting functionality with segmentation within the API calls.
var map = new OTMap(); map.put("item", "Panasonic Lumix DMC-TZ30"); map.put("brand!", "Panasonic"); map.put("price", "257"); map.put("item-type", "camera[+257]"); OTLogService.sendEvent("Checkout complete", map);
Click for details on reading Opentracker cookie data
<!-- note: you can remove the defer attribute from the script tag to avoid issues with load on ready functionality --> <script src="//script.opentracker.net/?site=www.opentracker.net"></script> <script type="text/javascript"> // Example of Sending data to the opentracker server // define the function that does the work function DoStuffFunction() { // define an empty variable called 'map' var map = new OTMap(); //define the properties to be logged to Opentracker map.put("color", "red"); map.put("email", "john.doe@example.com"); //send (submit) the data to Opentracker OTLogService.sendEvent("first event", map); //clear map data to send new event data map.clear(); //define the new properties to be logged to Opentracker map.put("shape", "circle"); map.put("location", "home"); //send the data to Opentracker again OTLogService.sendEvent("second event", map); //remove some data from the map object map.remove("location"); //alert the user id alert(_ot_uid()); //alert the session id alert(_ot_sid()); //example functions alert(map.get("shape")); alert(map.size()); alert(map.get("location")); } </script>
Opentracker also provides a static script. Legacy sites (prior to January 2013) need to specify a server parameter. The following javascript implements the above examples using a static script:
<script type="text/javascript" src="//cdn.opentracker.net/ot.20130905.js?site=ot3.opentracker.net&server=atc01.opentracker.net&onload=map"></script>
Notice the domain and script name have changed and the server parameter has been added (for sites added prior to January 2013). Static scripts need to be updated when a new version of the script is introduced. Static scripts need to be loaded only once by the browser, and are geographically located close to the user.