Learn about common strategies for implementing a global and scalable event tracking solution. The goal of event tracking is to collect information about your visitors’ interactions within a page. While page view tracking gathers information about the navigation path a visitor takes, event tracking monitors what visitors do in-between navigation steps.
Events are interactions a user has with your site that occur after the page has loaded. Examples of these interactions are: form field selections, file downloads, expanding menus, video plays, and many more.
We recommend using a reserved variable in the data layer named tealium_event to uniquely identify each type of interaction that is tracked on the site. The values set for this variable will be plain-English descriptors of the events being tracked. This variable will be used throughout Tealium iQ to configure load rules, extensions, and data mappings. Additional data related to the event should be included in the data layer of the tracking call.
This method tracks non-page views, page interactions, and other dynamic events that might occur on a page. Calling this method will trigger the corresponding event tracking functionality within your configured vendor tags.
Best practice is to use the variable tealium_event to uniquely identify events.
utag.link(data_object, callback, [uid_array]);
data_object Object, optional
A data object containing the attributes associated with this specific tracking call. Uses the same format and variable names as the Universal Data Object.
callback Function, optional
A function to be executed after the tracking call has completed.
uid_array Array, optional
An array of tag IDs. Will limit the tracking call for the vendor tags specified by the UID’s in this array.
Example of an “Add to Cart” event, without a callback function, tracked by all tags:
Just as page view tracking requires a data layer object to give context about which page is being tracked, event tracking also requires a data layer object be included in the tracking calls.
For example, the variable utag_data.page_type in the data layer helps distinguish between different types of pages (product, search, cart, etc.) and the variable utag_data.tealium_event distinguishes between the different events to be tracked (cart_add, newsletter_signup, user_login, etc.). Similarly, as certain data layer variables are only relevant to certain page types (eg. search_keyword on Search pages), only variables relevant to a tracked event are required in the tracking call (eg. social_network when tracking a social share event).
The following options describe the various methods of implementing Tealium’s event tracking into your website.
Option #1 - jQuery Extension and HTML5 data attributes
The jQuery Extension is used for tracking basic interactions within a page, such as clicking, expanding, ticking, checking, selecting, etc. HTML5 supports data attributes which can be used to associate information to elements in the page. To implement a site-wide custom click tracking solution a global markup strategy should be created to expose the necessary event attributes in the data attributes of the elements to be tracked.
An element with data attributes might look like this in the page code:
These attributes can then be used in the jQuery Extension selector and to set values in your data layer object. Using the “JS Code” option you can dynamically assign the value of a data attribute to a data layer variable.
To use data attributes with the jQuery Extension:
Use a selector to identify elements with a specific data attribute eg. a[data-click_name]
Set a variable using the “JS Code” option to reference a data attribute in the clicked element eg. $(this).data('click_name')
Best Uses: link clicks, button clicks, form field interactions
Not recommended for: ajax page flows, form submissions
Option #2 - Coded utag.link, utag.view
Used for tracking dynamic page content refreshes, ajax pages, modal form submissions or any event that requires a round-trip request/response to the client’s web server to fetch additional data not already present on the page.
Best Uses: modal forms, product quick view, single page websites, add to cart from non-product pages
Not recommended for: link tracking
Option #3 - Page Data Layer
Used when an event occurs at the same time as a new page load. The default page view tracking can perform the event tracking at the same time provided the required data layer variables are present (eg. event_name). For example, in a cart checkout process, when asked to checkout as guest, new customer, or existing customer, if you select “existing customer” and login with correct credentials, the following page load could contain this data layer indicating it is the “Shipping” section of the checkout and that a “user_login” event has occurred:
Best Uses: user login, user registration, “success” pages
Not recommended for: modal forms, ajax pages
Option #4 - Video