Custom Events Integration

Embed code automatically tracks all out-of-the box events. Some events, however require manual integration by invoking the JavaScript function sendVueAnalyticsEvent through your code.

This is applicable if you use APIs for Recommendations and script for Events tracking (Mixed mode of Integration). You need to integrate with the Javascript functions to track events from carousels rendered with the Vue.ai recommendations.

For the description of out-of-the box events and the ones that need manual integration, please refer the following table:

Event	Description	Requires manual integration
pageView	Load of any page	no
addToCart	When user adds an item to the cart by clicking on "Add to cart" button or any other equivalent action	sometimes (when tracking events from carousels rendered with the Vue.ai recommendations)
removeFromCart	When user removed an item from the cart by clicking on "Remove from cart" button or any other equivalent action	sometimes (when tracking events from carousels rendered with the Vue.ai recommendations)
orderConfirmation	When user has completed the purchase on order confirmation page	no
addToWishlist	When user adds an item to the wishlist by clicking on "Add to wishlist" button or any other equivalent action	sometimes (when tracking events from carousels rendered with the Vue.ai recommendations)
removeFromWishlist	When user removes an item from the wishlist by clicking on "Remove from wishlist" button or any other equivalent action	sometimes (when tracking events from carousels rendered with the Vue.ai recommendations)
socialShare	When user shares the product in social medium by clicking on "Share" button or any other equivalent action	no
placeOrder	Fired on click of the place order / buy now button or any equivalent event	sometimes (when tracking events from carousels rendered with the Vue.ai recommendations)
recommendationView	On load of the recommendations in any page	yes
recommendedProductView	When user clicks on any of the recommendations	yes
leftSwipe	When user tries to see more recommendations using swipe or any other equivalent action	yes
rightSwipe	When user tries to see more recommendations using swipe or any other equivalent action	yes

Javascript Function#

Call the function sendVueAnalyticsEvent to track custom events#

Request Parameters:#

Param	Description	Type
name	Indicates name of the event. Refer event names from the table	string
action	Indicates action of the event. Refer event actions from the table	string
non_interaction	Indicates action triggered by interaction or otherwise. Allowed Values: 'true', 'false'	string
metaData -> module_id	Indicates the ID of the module that is rendered in recommendation	string
metaData -> module_name	Indicates the name of the module that is rendered in recommendation	string
metaData -> strategy_id	Indicates the ID of the strategy that is rendered in recommendation	string
metaData -> module_behaviour	Indicates how the recommendation is rendered. Allowed Values: inline, popup	string
metaData -> recos_served	Indicate the number of products that is recommended	integer
metaData -> pos_of_reco	Position of the product that was clicked in the recommendation	integer
metaData -> product_list -> product_id	when name = recommendationView, indicates the unique product identifier of the product for which recommendations are viewed.when name = recommendedProductView, indicates the unique product identifier of the product which was clicked on.	string
metaData -> product_list -> price	Indicates the price of the product that the user saw as recommendation	string
metaData -> product_list -> quantity	Indicates the quantity of the product that the user saw as recommendation	integer
metaData -> referrer_product -> product_id	Indicates the unique product identifier of the product which is available in the page from which the recommended product was clicked on	string
metaData -> referrer_product -> price	Indicates the price of the product which is available in the page from which the recommended product was clicked on	string
metaData -> order_by	Indicates the sort order applied on the Product Listing page. Sort section describes this in detail	JSON object
metaData -> filters	Indicates the filters applied on the Product Listing page. Filters section describes this in detail	array of JSON objects

Example Code#

Event - recommendationView#

const eventData = {   name: 'recommendationView',   action: 'pageView',   non_interaction: module.behaviour === 'inline' ? 'true' : 'false',   metaData: {     module_id: "23",     module_name: "Inspired by Browsing History",     module_behaviour: "inline"/"popup",     recos_served: 8,     product_list: [{        product_id: "p1234",        price: "3000.00",        quantity: 1    }]   } };
 window.vuex.v1.sendVueAnalyticsEvent(eventData);

Event - recommendedProductView#

Note:

The product_list should be the product that your customer is clicking on the recommendation widget. There should be only one element in this parameter.

Note:

The referrer_product should be the product that is in view in the Product Detail Page or the product for which recommendations are displayed. In pages where there is no source product present, this field can be ignored.

 const eventData = {   name: 'recommendedProductView',   action: 'click',   non_interaction: 'false',   metaData: {     strategy_id: "234",     module_id: "23",     module_name: "Style it With",     module_behaviour: "popup",     product_list: [{        product_id: "p2345",        price: "250.00"     }],     referrer_product: {        product_id: "p1234",        price: "3000.00"     },     pos_of_reco: 3   } };
 window.vuex.v1.sendVueAnalyticsEvent(eventData);

Event - leftSwipe#

 const eventData = {   name: "leftSwipe",   action: 'click',   non_interaction: 'false',   metaData: {       module_id: "23",       module_name: "Style it With",       module_behaviour: "popup",  }};

Event - rightSwipe#


 const eventData = {   name: "rightSwipe",   action: 'click',   non_interaction: 'false',   metaData: {       module_id: "23",       module_name: "Style it With",       module_behaviour: "popup",  }};
window.vuex.v1.sendVueAnalyticsEvent(eventData);

Event - addToCart#


 const eventData = {   name: 'addToCart',   action: 'click',   non_interaction: 'false',   metaData: {     strategy_id: "234",     module_id: "23",     module_name: "Style it With",     module_behaviour: "popup",     product_list: [{         product_id: "p2345",         price: "250.00"     }],     referrer_product: {         product_id: "p1234",         price: "3000.00"     },     pos_of_reco: 3   } };
window.vuex.v1.sendVueAnalyticsEvent(eventData);

Event - removeFromCart#


 const eventData = {   name: 'removeFromCart',   action: 'click',   non_interaction: 'false',   metaData: {     strategy_id: "234",     module_id: "23",     module_name: "Style it With",     module_behaviour: "popup",     product_list: [{         product_id: "p2345",         price: "250.00"     }],     referrer_product: {         product_id: "p1234",         price: "3000.00"     },     pos_of_reco: 3   } };
window.vuex.v1.sendVueAnalyticsEvent(eventData);

Event - addToWishlist#


 const eventData = {   name: 'addToWishlist',   action: 'click',   non_interaction: 'false',   metaData: {     strategy_id: "234",     module_id: "23",     module_name: "Style it With",     module_behaviour: "popup",     product_list: [{         product_id: "p2345",         price: "250.00"     }],     referrer_product: {         product_id: "p1234",         price: "3000.00"     },     pos_of_reco: 3   } };
window.vuex.v1.sendVueAnalyticsEvent(eventData);

Event - removeFromWishlist#


 const eventData = {   name: 'removeFromWishlist',   action: 'click',   non_interaction: 'false',   metaData: {     strategy_id: "234",     module_id: "23",     module_name: "Style it With",     module_behaviour: "popup",     product_list: [{         product_id: "p2345",         price: "250.00"     }],     referrer_product: {         product_id: "p1234",         price: "3000.00"     },     pos_of_reco: 3   } };
window.vuex.v1.sendVueAnalyticsEvent(eventData);

Event - placeOrder#


 const eventData = {   name: 'placeOrder',   action: 'click',   non_interaction: 'false',   metaData: {     strategy_id: "234",     module_id: "23",     module_name: "Style it With",     module_behaviour: "popup",     product_list: [{         product_id: "p2345",         price: "250.00"     }],     referrer_product: {         product_id: "p1234",         price: "3000.00"     },     pos_of_reco: 3   } };
window.vuex.v1.sendVueAnalyticsEvent(eventData);