Track events with ibexa-tracker.js¶
This is another example of how you can integrate the tracking with a Google-style JavaScript in your site. The approach is very generic and evaluate it if it meets your requirements and security policy.
If you want the userid
to be generated automatically, set user
parameter as empty ''
in the _ycq.push
calls.
If a predefined cookie already exists, it is used.
Otherwise a new one is created.
Tracking code quickstart¶
The Personalization JavaScript is a Google-like tracking API (ga.js) that you can paste into your pages. It activates the tracking by inserting https://cdn.perso.ibexa.co/ibexa-tracker.js into the page.
To use this mechanism on your pages, copy the code snippet below, and replace
<YOUR_MANDATOR_ID>
with the customer ID, <PAGE_ID>
with the page/item identifier
and <USER_ID>
with the one generated by your user identifier.
All identifiers can be any form of string.
Paste this snippet into your website template page so that it appears before
the closing </head>
tag.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
|
Asynchronous syntax¶
The _ycq
object is what makes the asynchronous syntax possible.
It acts as a queue, which is a "first-in, first-out" (FIFO) data structure that
collects API calls until ibexa-tracker.js
is ready to run them.
To add to the queue, use the _ycq.push
method.
To push an API call into the queue, you must convert it from the traditional JavaScript syntax to a command array. Command arrays are JavaScript arrays that conform to a certain format. The first element in a command array is the name of the tracker object method that you want to call. It must be a string. The remaining elements are the arguments you want to pass to the tracker object method. These can be any JavaScript value.
Tracking code¶
The _ycq
global object can be used directly for asynchronous page tracking
with the push(...)
method.
_ycq
object methods¶
push¶
push(commandArray)
Executes the command array, which is a JavaScript array that conforms to the following format. The first element of the array must be the name of a tracker object method passed as a string. The rest of the array elements are the values to be passed in as arguments to the function.
Here is an example of typical usage of the method:
1 2 3 |
|
Tracker object names¶
Object | Description | Example |
---|---|---|
_setMandator |
- Executed with one additional parameter: MandatorId |
_ycq.push (['_setMandator' , '<YOUR_MANDATOR_ID>']); |
_trackEvent |
- Executed with four additional parameters: ItemType , EventType , ItemId , UserId .- EventType can be any of the described types |
capturing an event: _ycq.push(['_trackEvent', '1', 'buy', '10', '']); |
_trackTimedEvent |
- Executed with five additional parameters: ItemType , EventType , ItemId , Timeout , UserId .- EventType can be any of the described types.- Timeout can be any integer greater than 0 representing time in ms |
consume event sent after 20s: _ycq.push(['_trackTimedEvent', '1', 'consume', '10', '20000', '']); |
_login |
- Executed with two additional parameters: anonymous userId, pseudonymous userId. - It is to be triggered when a user logs in and the tracking identity is changed. |
- |
ycreco=true |
- If you want to send a click recommended event you can append the following parameter to the recommended item URLs: | https://mydomain.com/mypage.html?ycreco=true or https://mydomain.com/mypage.html?myparameter=x&ycreco=true |
Tracking with HTML event handlers¶
The asynchronous tracking syntax should also be used from within DOM event handlers. For example, the following button generates an event when it is clicked:
1 |
|
Even if this button is clicked before the browser has finished loading ibexa-tracker.js
,
the event is captured and eventually executed.