Tracking visitor analytics and behavior is essential in order to provide accurate and visitor-specific search and category page results. UNBXD analyzes visitor events, such as product clicks, products added to the cart, orders, etc. These events are tracked using browser cookies. With this information, a profile is built for every visitor, based on his/her affinity to different categories, brands, or prices.

Event Types

Events are any action a visitor takes on your eCommerce store. This section helps you understand more about the session-based events we track, like:

Visitor

Identifies new and returning shoppers. When a user visits the website for the first time or visits the website after 30 mins of the ideal time, UNBXD identifies the user as a new shopper. UNBXD does this by creating the cookie. For new shoppers, UNBXD assigns a new user.id and session_id. After 30 mins of ideal time, user.id remains unchanged however session_id changed to a new value.

Search Hit

This event is supposed to be fired when a shopper searches for a product either by pressing enter or clicking on the search icon. This event should not be fired with an empty query.

Search Impression

Fire this event when a list of products is loaded on the search result page. It is fired with a pid list of all the products shown on the first search result page and then as the user visits the subsequent pages.

Product Click

Fire this event when a user clicks on a product listed on the search result page or category page.

Add to Cart

Fire this event when a user adds a product to the cart. Fire this event for each of the products added to the cart.

Orders

Fire this event for each of the items in the order. For example – if 4 items are bought in one order then we need to fire an order event for each of the items. UNBXD also provide unbxd.trackMultiple in which customer can pass multiple orders in one API.

Cart Removal

Fire this event for the item which is removed from the cart.

Dwell time

The time a shopper has spent on a product page.

Facets

This will fire when the user will select the filters on the listing pages. Filters applied for search or browse events.

Configuration

Your first step is to insert a JavaScript code snippet within all the HTML pages on your website.

This snippet will not affect the performance of the page as it will be loaded asynchronously. This code could be inserted anywhere on the page (header, body, footer) and need not be included in the head section of the HTML.

				
					<script type="text/javascript">/* * * CONFIGURATION * * */
var UnbxdSiteName = "<Site_ Key>" ; // Replace the value with your Site Key. /* * * DON'T EDIT BELOW THIS LINE * * */
( function () 
{
var ubx = document.createElement('script' );
ubx.type = 'text/javascript'; 
ubx.async = true ;
ubx.src = '//libraries.unbxdapi.com/ua-js/v1.0.0/uaLibrary.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ubx);
}
)
(); 
</script>

Where UnbxdSiteName is a unique identifier provided when you create an UNBXD account. You can also get the Site Key from Manage > Configure Site > Keys from within the Console. This is a mandatory field

After integrating the configurations, you might want to track the analytics for all the events.

The analytics events are tracked in two ways.

Using HTML attributes: You can insert custom HTML tags for tracking events. The Javascript works in tandem with the custom HTML attributes to identify and track events as they happen automatically.

				
					<button type = "submit" unbxdattr = "sq_bt" > Search </button>

The unbxdattr=”sq_bt” attribute is inserted on the link or search button (usually the magnification/search icon) that triggers search at the backend.

Using Tracker function: You can add custom APIs for tracking different visitor events. These event-based API calls will track every event and store information within the UNBXD Cloud server until the browser cookies are cleared.

				
					Unbxd.track(type,params)

Where type refers to the type of the analytics event and params refers to the associated parameters relevant to that analytics event.

Visitors

The Visitor event is the first event that gets created when a shopper visits your site.

There are two types of shoppers we track:

All shopper events are tracked against an anonymous User ID that is allotted to every shopper visiting your site.

Site-level information, like the userID, sessionId, and visitType parameter, are stored in three cookies titled:

All these files are created for first-time visitors.

A shopper is labeled first-time visitor when:

The shopper has visited your site for the first time.
unbxd.userId gets created
unbxd.visitId with a new value and unbxd.visit cookie with value "first_time" is created.
All the subsequent actions of the user will be captured as in the case of a first time user until there’s an idle period of 30 minutes or more.
If the shopper clears all the cookies then the cookies are downloaded again.

A shopper is labeled a repeat visitor when:

The User ID is a random numerical value with the timestamp of the visit and is device/browser-specific. For instance, a shopper accessing your site on Google Chrome and Mozilla Firefox on the same computer will have two different values for this cookie for each browser.

NOTE: The ‘unbxd.visitID’ and the ‘unbxd.visit’ cookies are set to expire after 30 continuous minutes of inactivity. If you have integrated the Unbxd analytics JS code, this event is tracked and pushed automatically, with no further action required.

If you have integrated the UNBXD analytics JS code, this event is tracked and pushed automatically, with no further action required.

Search Hit

The Search event is generated every time a shopper uses the search bar to search for a product on your site.

This event query will have the following pieces of information:

Keyword query
Site name
Web address
Referrer
Type of Visitor
Version of the SDK
Visit ID
Action performed
User ID
Site Key

Custom HTML attributes

Insert the unbxdattr=”sq” attribute within the < input > tag of the search box to capture the search query typed by the shopper.

				
					<input type="text" placeholder="Search" />

The unbxdattr=”sq_bt” attribute is inserted on the link or search button (usually the magnification/search icon) that triggers search at the backend.

Here’s what a typical response would look like:

				
					<button type = "submit" unbxdattr = "sq_bt" > Search </button>

Tracker Function

To track a shopper’s search hits, insert the following API query on the link or search button (usually the magnification/search icon):

				
					unbxd.track("search" , { "query" : <QUERY> })

Where,

query: Indicates the shopper’s search text

Here’s what a typical response would look like:

				
					unbxd.track("search",{"query" : "dress"});

To track Autosuggest results through the Unbxd Analytics.js using HTML tags.

Autosuggest Types supported for tracking

Autosuggest tracking is a part of the search event analytics. However in case when a user selects any of the autosuggest suggestions instead of clicking on the search button, then search event hits need extra information about the autosuggest option selected by the user.

UNBXD Autosuggest types:

Attributes required to be set for Autosuggested HTML elements

unbxdAttr = “autosuggest”
unbxdParam_autosuggestType = “”
unbxdParam_autosuggestSuggestion = “”
unbxdParam_autosuggestFieldName = “” Valid for autosuggest type IN_FIELD, eg. gender, for infield query gender: men
unbxdParam_autosuggestFieldValue = “” Valid for autosuggest type IN_FIELD, eg. men, for infield query gender:men
unbxdParam_autosuggestSrcField = “” Valid for autosuggest types INFIELD & KEYWORD_SUGGESTION, how the suggestion was generated. Eg. “color”, “color type”, “type” etc
unbxdParam_pid = “” Valid for autosuggest type POPULAR_PRODUCTS, id of the product clicked
unbxdParam_pRank = “” Rank of the suggestion

Integration Steps to add HTML attributes

Promoted Suggestion:

				
					{
unbxdAttr = “autosuggest”
unbxdParam_autosuggestType = “PROMOTED_SUGGESTION”
unbxdParam_autosuggestSuggestion = ”<suggestion_value>”
unbxdParam_autosuggestFieldValue = null
unbxdParam_autosuggestFieldName = null
unbxdParam_autosuggestSrcField = null
unbxdParam_pRank = (rank in the dropdown)
unbxdParam_pid = null
}

Keyword Suggestion:

				
					{
unbxdAttr = “autosuggest”
unbxdParam_autosuggestType = “KEYWORD_SUGGESTION”
unbxdParam_autosuggestSuggestion = “<suggestion_value>”
unbxdParam_autosuggestFieldValue = null
unbxdParam_autosuggestFieldName = null
unbxdParam_autosuggestSrcField = “<source_unbxd_fields>”
unbxdParam_pRank = (rank in the dropdown)
unbxdParam_pid = null
}

Product Click

The Product Click event is generated every time a shopper clicks on a product in a Product Listing Page (PLP) or in a recommendation widget. This helps us understand your shoppers’ search preferences. This information is analyzed to list and promote ‘Popular Products’ in the autosuggest dropdown and display personalized ‘Recommended For You’ recommendations.

There are two ways you can integrate the functionality to track product clicks:

Custom HTML attributes

You can insert the following code snippet within < div > of product grid (product thumbnail) or within the < li > html tag.To display products within the PLP on the search results or category page,

				
					<li unbxdattr="product" unbxdparam_sku="SKU001" unbxdparam_prank="1" unbxdparam_requestId="607a0bbf-179a-44af-8bdd-e58fef7fc5f3" >
</li>

Sample code snippet with < li > tags:

				
					<div unbxdattr="product" unbxdparam_sku="SKU001" unbxdparam_prank="1" unbxdparam_requestId="607a0bbf-179a-44af-8bdd-e58fef7fc5f3">
</div>

Where,

unbxdattr: Specifies the type of event getting captured. For product clicks, the value is “product” always.
unbxdparam_sku: Specifies the uniqueId of the product as defined in the feed. You can get this from the UNBXD search API response.
unbxdparam_prank: Specifies the position of the product in the search results grid/list. When this value is not specified, the value of the product that appears first in the list will be 1, and the value of the product that appears second will be 2, and so on.
unbxdparam_requestId: Specifies the request Id which is the part of the response readers of the Search/Category API request.

Tips: For enhanced tracking, set the following query information before loading the UNBXD analytics tracking plugin on a search and category Product Listing Page.

Tracker Function

				
					unbxd.track(“click”,{“pid”:”21423”})

Add to Cart

The Add to Cart (or known as Cart) event is generated when a shopper adds a product to the shopping cart.

There are two ways you can integrate the functionality to track Add to Cart clicks:

Custom HTML attributes

To track the number of ‘Add to Cart’, insert the following code snippet on the ‘Add to Cart’ button within your HTML page.

				
					<input unbxdattr="AddToCart" unbxdparam_sku="SKU001" unbxdparam_variant="VAR001" unbxdparam_qty="2" unbxdparam_requestId="607a0bbf-179a-44af-8bdd-e58fef7fc5f3">

Where,

unbxdattr: Specifies the type of event getting captured. For the cart event, the value is “AddToCart.”
unbxdparam_sku: Specifies the uniqueId of the product as defined in the feed.
unbxdparam_variant (optional): Specifies the uniqueID of the product variant added to the cart as defined in the feed schema. This parameter is a required field if the catalog has variants.
unbxdparam_qty (mandatory): The number of units added to the cart. This should be the string value of the quantity added. For example, if 4 quantity of a product is added then its value would be “4” (instead of 4).
unbxdparam_requestId: Specifies the request Id from the response of the search/category API. If the widget is not on the listing page, you can ignore this parameter., when products within the PLP widget have the Add to Cart button.

Tracker Function

To track every time a shopper clicks on the Add to Cart button for a product without variants, insert the following API code to the ‘Add to Cart’ button within your PDP’s HTML page to track products without variants.

				
					Unbxd.track("cart",{"pid"=<PID>,"qty":<QTY>,"requestId":<REQUESTID>})

To track products with variants added to a cart, insert this API code:

				
					Unbxd.track("cart",{"pid"=<PID>,"variantID"=<VID>,"qty":<QTY>,"requestId":<REQUESTID>})

Where,

pid: The unique identifier of the product as defined in the feed schema.
vid (optional) : The unique identifier of the variant added to the cart as defined in the feed schema. If this field is not available, we will not be able to track variants.
qty (optional): The number of variants added to the cart. If variants have not been added to the cart, the parameter value will be 1.
request Id: Specifies the request Id of the response, when products within the PDP widget have the Add to Cart button.

Order

The Orders event is pushed for every product that is purchased on your site.

There are two ways you can integrate the functionality to track orders that have been successfully completed:

Custom HTML attributes

To track a successful order, insert the following API code within the HTML tags on the order confirmation page on your site.

				
					<li unbxdattr="order" unbxdparam_sku="SKU001" unbxdparam_variant="VAR001" unbxdparam_price="500" unbxdparam_qty="2"></li>

Where,

unbxdattr: Specifies the type of event getting captured. For ordering the product, the value is “order”.
unbxdparam_sku: The unique identifier of the product as defined in the feed.
unbxdparam_variant (optional): Specifies the variantId of the product added to the cart as defined in the feed. This parameter is a required field if the catalog has variants.
unbxdparam_price: The amount of single unit a shopper has paid for the product/variant.
unbxdparam_qty: The number of products/variants purchased.

Tracker Function

To track every successful order for a product without variants, insert the following API code to the order confirmation page.

				
					Unbxd.track("order",{"pid":<PID>,"qty":<QTY>,"price":<PRICE>})

To track every successful order for a product with variants, insert this API code:

				
					Unbxd.track("order",{"pid":<PID>,"variantId":<VARID>,"qty":<QTY>,"price":<PRICE>})

Orders with Multiple Products

To track an order containing multiple products, you can use the Unbxd.trackMultiple function instead of calling the Unbxd.track function individually for each product in the order basket :

				
					Unbxd.trackMultiple("order",[{"pid":<PID>,"qty":<QTY>,"price":<PRICE>},{"pid":<PID>,"qty":<QTY>,"price":<PRICE>},...])

Where,

pid: The uniqueId of the product as defined in the feed.
variant Id (optional): The variant Id of the variant added to the cart as defined in the feed. If the product feed has variants, this parameter is required.
qty: The number of variants added to the cart. If no value is specified, we will take the default value as 1.
price: The amount of a single unit a shopper has paid for the product ordered.

Remove from Cart

This event tracks every instance a product is removed from the cart as well. The information helps us better understand the visitor’s preferences.

There are two ways you can integrate the functionality to track products that have been removed from the cart:

Custom HTML attributes

To track products being removed from the cart, insert the following attributes within all “Remove from Cart” buttons on the cart page.

				
					<button unbxdattr = "RemoveFromCart" unbxdparam_sku = "SKU001" unbxdparam_variant = "VAR001" unbxdparam_price = "500" unbxdparam_qty = "2">

Where,

unbxdattr: Specifies the type of event getting captured. For cart removal, the value is “RemoveFromCart”.
unbxdparam_sku : UniqueId of the product as defined in the feed.
unbxdparam_variant (optional): UniqueId of the variant as defined in the feed. This parameter is optional and is only needed if the catalog has variants.
unbxdparam_price: Price of individual product/variant bought.
unbxdparam_qty (mandatory): The number of units added to the cart. This should be the string value of the quantity added. For example, if 4 quantity of a product is added then its value would be “4” (instead of 4).

To track products being removed from cart, insert the following APIs within all “Remove from Cart” buttons on the cart page.

				
					Unbxd.track ("cartRemoval",{ "pid":<PID>,"qty":<QTY>})

Where,

< PID>: Unique ID or SKU ID of the product
< QTY>: Number of products that are removed from the cart

Search Impression

A Search Impression (also known as Product Impressions) event is generated after a shopper gets a list of products on the search results page. This event is also generated every time a shopper refines the results by facets, filters, scroll-down or pagination. The productId of the products listed in the PLP will be sent as a payload.

There are two ways you can integrate the functionality to track Search Impression events:

Custom HTML attributes

To track every search impression, insert the following API code within the HTML tags on the product category pages on your site.

				
					<script type="text/javascript">UnbxdAnalyticsConf=window.UnbxdAnalyticsConf ||{};UnbxdAnalyticsConf["query"]="nike";</script>

Where:

query: Specifies the search query

Custom APIs

				
					Unbxd.track('search_impression',{query:query,pids_list:pids_list})

Where:

query: Search query

pids_list: List of newly loaded pids.

Example:

				
					Unbxd.track('search_impression', {query : ‘shirt’, pids_list : [‘a001’,’a002’]})

Dwell Time

A Dwell time event is generated to indicate the time spent on the Product Details Page (PDP). This event is generated every 10 seconds and serves to indicate the amount of time a shopper remains on the page.

There are two ways you can integrate the functionality to track product clicks:

Custom HTML attributes

To track the amount of time a shopper spends on a PDP, insert the following HTML on the product details page.

				
					<script type = "text/javascript">unbxdAnalyticsConf=window.unbxdAnalyticsConf|| {};unbxdAnalyticsConf['pid']=<pid>//if set will be treated page as PDP

Where,

pid: The unique identifier of the product as defined in the feed.

Custom APIs

To track the amount of time a shopper spends on a PDP, insert the following API code to the product category pages on your site.

				
					unbxd.track('dwellTime',{"pid":<pid>,"dwellTime":<dwellTime>})

Where:

pid: The unique identifier of the product as defined in the feed.
dwell time: The amount of time (in milliseconds) a shopper spends on a PDP.

Facets

A Facet event tracks the guided navigation on the Product Listing Page. The event query will list the specific filters the shopper has selected to narrow down the results on the search results page.

You can integrate the functionality to track product clicks using custom APIs.

Tracker Function

To track the facets a shopper has chosen on the Search page, insert the following API code to the SRP on your site.

				
					unbxd.track('facets',{query:<query>,facets:<facets>})

To track the facets a shopper has chosen on the Category page, fire the below function on the category page.

				
					unbxd.track('facets',{page:<path>,page_type:<page_type>,facets:<facets>})

Where,

< facets >: Array of all the currently applied facets (type json object).
< page >: Unique identifier for the page passed in the category page API as parameter ‘p’.
< page_type>: It is used internally by UNBXD for tracking. The value should be set to “BOOLEAN”.

Unbxd Events Validator

While there are multiple events that are tracked by Unbxd Analytics, it is now easier to validate the analytics onto your sites via our Chrome Extension. This extension can help to detect Analytics Integration Issues.

We have currently classified Analytics Issues into 2 broad categories:

Is the analytics script included and required objects (liked “UnbxdAnalyticsConf”) are initialized with correct values?
Are the relevant events fired correctly?

Are all events required for a particular page type fired correctly (search or browse page along with recommendations widget)
Are the events having all the required mandatory additional parameters (for example: “pid” must be sent for a click event)
Are there any additional parameters that can be sent in each event to improve analytics ( these are shown as warning items)
Any more validations that can be done on events correlation (for example: is the same “pid” sent in an impression -> Click -> Cart -> Order Flow)

Once the events are detected and a validation report is generated, you can download the report to validate it yourself or send it to us for further analysis for any required support in the integration.

The extension intercepts the network calls on the page to look for 1p.jpg calls, validates the event as per the page type, and reports it on the extensions UI.

How to install and use the extension?

Install the extension from the Chrome Store.
Go to any customer website and open the Developer Tools. You will see “ValidateUnbxdAnalytics” as a tab in the Developer Tools. Click on it.
Select your page (either Search or Category Page) and check the “Recommendation Widget” checkbox if you want to test the recommendations widget on that page as well.
Click on “Start Testing”.
Proceed to play around with customers’ websites and generate the Unbxd Analytics events. These will start showing up in the extensions UI
Once you’re done with all the actions to generate the events, click the “Stop” button. This will generate a report which states any missing mandatory or good to have events.
You can also download the CSV report of the same by clicking the “Download CSV” button.

Did this answer your question?
No…
I have some feedback
Feedback is submitted

On this Section

Event Types
Configuration
Visitor
Search Hit
Product Click
Add To Cart
Order
Remove From Cart
Search Impression
Dwell Time
Facets

Browser Integration

Introduction

Event Types

Configuration

Visitors

Search Hit

Custom HTML attributes

Tracker Function

Product Click

Custom HTML attributes

Add to Cart

Custom HTML attributes

Tracker Function

Order

Custom HTML attributes

Tracker Function

Remove from Cart

Custom HTML attributes

Search Impression

Custom HTML attributes

Custom APIs

Dwell Time

Custom HTML attributes

Custom APIs

Facets

Tracker Function

Unbxd Events Validator

How to install and use the extension?

No…

On this Section