Web activity tracking

The foundation of web activity tracking is identification and cookies. A contact can be identified through the script in three ways:

The script, once implemented, will generate a unique client ID and store it in a first-party cookie named _va. All web activity on that browser will then be linked to that client ID via the cookie. When that user clicks on a link in an email from Engage, the tracking script reads the contact ID from the URL (vtid) and stores it in a cookie named _vaI. With this method, all web activity can be connected to a specific contact in Engage.

Read more about identification here.

The tracking script enables abandoned cart functionality. By registering every state of a user’s cart, Engage is able to receive information about cart abandonment and use this to trigger automation workflows.

How to get started:

If you want to learn more about abandoned cart from a user's perspective, check out Help Center.

The tracking script enables abandoned browse functionality, in the same way as abandoned cart. The site sends product view and cart events to Engage through the tracking script (or the API if the user has been identified). Using this Engage can detect when a session is abandoned and nothing has been added to the cart and then trigger an automation.

How to get started:

If you want to learn more about abandoned browse from a user's perspective, check out Help Center.

By tracking which products a user interacts with, Engage can calculate a list of products of interest. This can then be used in, for example, segmentations. This data will also be a part of the algorithm that calculates Engage's product recommendations.

The sessionId value is unique for every session. When using the tracking script, it is included automatically in the data sent. However if you are using the API to handle web activity tracking, the sessionId needs to be manually added to the payload that you send.

While the sessionId value is not mandatory for Abandoned Cart events, it will need to be included if the retailer is using Abandoned Browse and Abandoned Cart together. This is to prevent both automations from being triggered based on the same sessionId.

Engage will check if "cart" and "productView" events are using the same sessionId. If they are, then only the Abandoned Cart automation in Engage will be triggered. The Abandoned Browse automation will only get triggered if there are no cart events registered during the session that has that specific sessionId.

To summarise:

A tracking script allows you to gather behavioral data such as cart changes and product views from website visitors. It consists of a small snippet of code, usually as JavaScript, placed in the HTML source code of a website. The tracking script is required for using features like abandoned cart and products of interest. The tracking script should not be confused with tracking parameters attached to the URL.

Once the script is implemented it will generate a unique client ID and store it in a first-party cookie named _va. All web activity on that browser is then linked to that client ID via the cookie. When that user clicks on a link in an email from Engage, the tracking script reads the contact ID from the URL (vtid) and stores it in a cookie named _vaI. With this method, web activities can be connected to a specific contact in Engage.

This is the Voyado tracking script:

<script>
    (function (i, s, o, g, r, a, m) {
        i['VoyadoAnalyticsObject'] = r;
        i[r] = i[r] || function () { (i[r].q = i[r].q || []).push(arguments) }, i[r].l = 1 * new Date();
        a = s.createElement(o), m = s.getElementsByTagName(o)[0];
        a.async = 1;
        a.src = g;
        m.parentNode.insertBefore(a, m)
    })(window, document, 'script', '[SCRIPT-PATH]', 'va');
    va("setTenant", "[TENANT-ID]");
</script>

Two things need to be changed here before you can use it, [SCRIPT-PATH] and [TENANT-ID].

Once you know these two values, you can put them in to configure your tracking script.

Here's an example of how it looks when it is configured.

<script>
    (function (i, s, o, g, r, a, m) {
        i['VoyadoAnalyticsObject'] = r;
        i[r] = i[r] || function () { (i[r].q = i[r].q || []).push(arguments) }, i[r].l = 1 * new Date();
        a = s.createElement(o), m = s.getElementsByTagName(o)[0];
        a.async = 1;
        a.src = g;
        m.parentNode.insertBefore(a, m)
    })(window, document, 'script', 'https://assets.voyado.com/jsfiles/analytics_0.1.7.min.js', 'va');
    va("setTenant", "supershop");
</script>

The tracking script can now be placed as it is (implemented in code) on your website, or implemented through a tag manager such as Google Tag Manager (GTM).

To increase the identification rate for Safari browsers, cookies can be created server-side. The latest script version (0.1.7) supports this. See this article to read more and see how to adjust your implementation.

Identification means linking a user to a contact ID in Engage. When a user is identified, it's then possible to build an understanding of their behavior on the site and offer a personalized experience and more relevant communication.

Common situations when a visitor is identified are:

As soon as a visitor is identified by the site (see the common cases listed above) the setContactId() method should be invoked.

Keep in mind the visitor might already be identified (such as by an email link click), and invoking this method incorrectly might clear the existing identification. The function setContactId() will not generate a HTTP request to the Collect endpoint.

va("setContactId", "contactId");

From when a contact is identified, all upcoming tracking events from the same browser are linked to them. This applies until the first-party cookie disappears or changes (for example, when another user logs into the site from the same browser). Voyado recommends that the e-com always includes the contactId in all tracking events such as cart() and productview().

Regardless of whether the contact is identified or not, all tracking events are always linked to the browser via a first-party cookie. That means anonymous tracking events can be linked to a contact ID afterwards, and the e-com site should not limit tracking events such as cart() and productview() to only identified or logged-in users.

*In Safari, the lifespan of all cookies created with JavaScript is a maximum of 7 days, but this can be extended using server-side cookies (see below).

Call setContactId() only when the user is identified by the site.

As soon as the site knows who the user is (for instance after login), setContactId() must be called with the user’s contactId. Likewise, when using the soft identification in links to sites implementing the tracking script, make sure to set the contactId from the decrypted eClub query parameter. The function should never be called with zero, empty (no value) or other invalid value, as this could potentially reset an existing identification.

The cookie _vaI (which stores the contactId) is created client-side by the script. With Apple ITP (Intelligent Tracking Prevention) all client-side cookies (and LocalStorage) have a capped lifetime (of 7 days) in Safari. Which means that when an identified visitor doesn't revisit the site within 7 days, the cookie will expire and the script won't be able to identify the visitor using the _vaI cookie.

The cookie lifetime cap applies only to cookies created client-side (with Safari) and doesn't affect server-side created cookies. The tracking script now supports copying the value from a cookie _vaI_server created server-side as a fallback to recreate the client-side cookie _vaI.

The cookie _vaI will be recreated, if needed, in this specific order:

By implementing _vaI_server identified visitors will stay identified when returning even after 7 days have passed. To implement this, the site (server-side) should check if the request includes a _vaI cookie. If so, the site should copy the value to a new cookie _vaI_server, giving it a 1-year expiration date, and add it to the response.

An example in C#:

if(HttpContext.Request.Cookies.TryGetValue("_vaI", out var contactId) && !string.IsNullOrWhiteSpace(contactId) && contactId != "undefined")
{
    var option = new CookieOptions 
    { 
        Expires = DateTimeOffset.Now.AddYears(1), 
        HttpOnly = false
    };            
    HttpContext.Response.Cookies.Append("_vaI_server", contactId, option);
}

This is how the flow looks:

The following are required so that an abaondoned cart automation can be triggered:

Here is how to use the tracking script to track cart changes.

va("cart",{
    "cartRef":"354354",
    "contactId":"afa7625d-2e97-4667-b4c1-ad3b01194bee",
    "cartUrl":"https://www.store.se/cart?id=354354",
    "locale":"sv-SE",
    "items":
    [{
        "itemId": "456436",
        "quantity": 2,
    },
    {
        "itemId": "456437",
        "quantity": 2,
    }]
}); <!-- Adds two products in the cart-->

va("emptyCart",{
    "cartRef":  "354354"}
);

It's possible to submit cart changes directly via the API instead of implementing the tracking script. If you choose this approach, it is important to identify all contacts that come to the e-com via links in emails (add “vtid” in “contactId”). The calls can be tested through your OpenAPI (Swagger) page.

[tenantname].voyado.com/api/v3/ui/index#/tracking

Read more about the Engage API and your OpenAPI page here.

All behavioral data can be used to build understanding and insights. A shopping cart belonging to an anonymous user can still be linked to a contact after they are identified.

Cart updates: Call the “cart()” script method (for identified and anonymous users) or the Carts API (for identified users only) for all updates to the shopping cart, regardless of where on the site or at what stage the cart update takes place (product page, popup or checkout). Engage handles the shopping cart based on its latest change. It is therefore important that all changes generate a call to “cart()” or the Carts API and that the data corresponds to the shopping cart currently displayed on the website.

cartRef: The “cartRef” value must be unique and must not be shared between different baskets or users. A "cartRef" of a specific shopping cart must not be changed, and all updates regarding a shopping cart must use the same "cartRef" value.

Empty carts: Use “cartRef” for empty carts as well. Even empty carts need a cart reference.

Locale: Call the “cart()” script method or Carts API with a “locale” value corresponding to the locale of your Product Feed in Engage. In order to enrich the products with article data, a Product Feed for that locale needs to be set up in Engage. An automation using that locale also needs to be active.

Abandoned carts: All carts not emptied before the website visitor leaves, or makes a purchase, risk being marked as abandoned. If you have an abandoned cart automation active that will be triggered by those unemptied carts.

Product views can be tracked through:

When tracking product views, the JavaScript method used is productview().

The following features in Engage are enabled by the tracking of product views.

The following are required so that an abandoned browse automation can be triggered:

Here is how to use the tracking script to track product views.

va("productview", {
   "categoryName": "Women / Armour / Greaves",
   "itemId": "123XYZ",
   "contactId":"afa7625d-2e97-4667-b4c1-ad3b01194bbb",
   "locale":"sv-SE"
})

It's possible to submit product views directly via the API instead of implementing the tracking script. Keep in mind, if doing things that way, that a lot of functionality that exists out-of-the-box when using the script has to now be handled directly by the retailer.

Read more about the Engage REST API here or go directly to the Swagger page to try it out.

Here's how to verify that tracking of your product views is working.