trackProductAdd()
is used to listen when a product has been added to cart. This functions by listening for clicks on an element. This data will be used for analytics and for powering XGen’s AI predictions.
id
Must match exactly 1 to 1 with aprod_code
in the XGen catalog. If these do not match exactly, product tracking and predictions will not function properly.You can check to ensure they are the same by going to the XGen platform and going to the “Catalogs” section. Select the catalog you are tracking and search for the id you are passing into the event.
Syntax
trackProductAdd(productInfo);
Parameters
productInfo
type: object
description: Contains information for the product to be tracked.
keys:
id
type: string
description: The unique prod_code
for the product being added to cart. Make sure this ID matches exactly 1 to 1 with a prod_code
in XGen’s catalog. (see warning at the top for more info)
name
type: string
description: The name of the product being added.
price
type: number
or string
description: The price of the product being added. Make sure this matches the price that the user will pay for that product. If the product is on sale, the marked down price should be used.
currency
type: string
(currency code)
description: The currency code that will be used when purchasing the product that is being added. Make sure it is a three letter currency code in the format of 'USD'
, 'EUR'
, 'JPY'
, etc.
Return Value
This function has no return value.
Examples
Track product-add on element(s) using a selector
In this example, we get the product info from a global variable and track that information when the user clicks on an element that matches the provided selector. The currency is also hard coded to 'USD' you will want to make sure to update this with the currency on the page.
// Import the integration from the 'installation' step
import { integration } from './xgenSdkIntegration';
// Get product info
const productInfo = window.productInfo;
// Set up listener to track PDP
document.querySelector('.addToCart', () => {
// Track the PDP page
integration.trackProductAdd({
id: productInfo.sku,
name: productInfo.name,
price: productInfo.price,
currency: 'USD'
});
});