---
title: "User Interaction Tracking"
slug: "user-interaction-tracking-fashion"
description: "Set up Mapp Fashion tracking: page views, customer identification, product views, basket actions and orders, plus the product identifiers each one needs."
status: "update"
updated: 2026-10-14T14:09:05Z
published: 2026-10-14T14:09:05Z
canonical: "docs.mapp.com/user-interaction-tracking-fashion"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mapp.com/llms.txt
> Use this file to discover all available pages before exploring further.

# User Interaction Tracking

## Overview

User Interaction Tracking records the kind of customer behavior required to use Mapp Fashion in a meaningful way. It captures page views, product views, basket actions, and completed orders. This data provides the context used for recommendations, reporting, and attribution.

Without User Interaction Tracking, Mapp Fashion can’t reliably interpret customer behavior or link interactions to products and conversions.

Here we’ll explain which customer interactions must be tracked and how to trigger the corresponding tracking calls. As a prerequisite, the Mapp Fashion extension for the Mapp Intelligence Smart Pixel should already be set up.

---

## Tracking Calls and Functions

> [!NOTE]
> **Product identifiers**
> 
> Tracking identifiers map directly to the [Mapp Cloud Product Catalog](/v1/docs/connect-product-catalog):
> 
> - `id` is the variant-level identifier (SKU): a specific purchasable item including colour and size.
> - `fashionStyleId` is the Style ID: the grouping of variants that share the same style and colour across sizes.
> 
> Always send the same identifiers you store in the Mapp Cloud Product Catalog.
> 
> For how identifiers map across product data, tracking and the API, see [Product and Customer Identifiers](https://docs.mapp.com/docs/mapp-fashion-product-and-customer-identifiers).

Each of the following tracking methods captures a specific type of customer interaction. Use these calls to record the corresponding actions at the appropriate point in your site logic.

---

### Page View Tracking

Tracks when a shopper [views a page](/v1/docs/track). This function is essential for linking all subsequent interactions, especially when the user has multiple tabs open. Always trigger a page view before sending any product, basket, or order data to ensure proper session context.

```javascript
wtSmart.track();
```

---

### Identify (Customer Identification)

Connects customer actions before and after login. Use this function when a customer:

- Logs in
- Registers a new account

You can also include customer identity details in the order event to link purchases with known users.

**Example**

```javascript
wtSmart.customer.data.set({
  registrationEmail: "customer@example.com", // pseudonymized automatically
  id: "id_from_your_database_here"
});
```

**Parameters**

| Parameter | Type | Description |
| --- | --- | --- |
| `registrationEmail` | String | Customer email. Automatically pseudonymized (hashed), but not fully anonymized. |
| `id` | String | Stable unique identifier, such as a database ID. |

---

### Product Detail Page (PDP)

Captures when a shopper views a specific product detail page or product view. Trigger this call when a customer:

- opens a product detail page
- switches to another product variant (for example, color or size)
- views products that are loaded dynamically via JavaScript

If products are loaded dynamically, trigger a new PDP call for each view.

**Example**

```javascript
wtSmart.product.view.data.set([{
  id: "SKU-12345",
  cost: 99.90,
  quantity: 1,
  fashionStyleId: "XYZ789"
}]);
```

**Parameters**

| Parameter | Type | Description |
| --- | --- | --- |
| `id` | String | Required. Unique product variant identifier (SKU) — a specific purchasable item including colour and size. Must match the variant identifier stored in the Mapp Cloud Product Catalog. |
| `quantity` | Number | Quantity of products added or removed. |
| `cost` | Number | Unit price of the product. |
| `fashionStyleId` | String | Required. Style ID — groups product variants that share the same style and colour across sizes. Must match the Style ID stored in the Mapp Cloud Product Catalog. |

---

### Add to Basket / Remove from Basket

Use this function when a shopper adds or removes a product from their basket.

**Example**

```javascript
wtSmart.product.addToCart.data.set([{
  id: "SKU-12345",
  cost: 99.90,
  quantity: 1,
  currency: "GBP",
  fashionItemTitle: "Dress",
  fashionItemCategory: "Dresses"
}]);

wtSmart.product.deleteFromCart.data.set([{
  id: "SKU-12345",
  cost: 99.90,
  quantity: 1,
  currency: "GBP",
  fashionItemTitle: "Dress",
  fashionItemCategory: "Dresses"
}]);
```

**Parameters**

| Parameter | Type | Description |
| --- | --- | --- |
| `id` | String | Required. Unique product variant identifier (SKU) — a specific purchasable item including colour and size. Must match the variant identifier stored in the Mapp Cloud Product Catalog. |
| `quantity` | Number | Quantity of items added or removed. |
| `fashionItemTitle` | String | Product name. |
| `fashionItemCategory` | String | Product category. |
| `cost` | Number | Unit price of the product. |
| `currency` | String | ISO currency code (e.g., GBP, EUR). |

---

### Order Confirmation

Captures completed orders.

Each order must include at least one product entry. A product entry represents a specific product variant and its corresponding quantity that is part of the order. These entries use the same product parameters as other product tracking calls, but are submitted in the context of an order.

An order is considered invalid if:

- No line items are provided, or
- A line item has no `id` or `quantity`

**Example**

```javascript
wtSmart.order.data.set({
  value: 120.99,
  id: 'M-12345',
  tax: 19.99,
  shippingCosts: 4.95,
  currency: "GBP"
});

wtSmart.product.confirmation.data.set([{
  id: "SKU-12345",
  cost: 99.90,
  quantity: 1,
  currency: "GBP",
  fashionItemTitle: "Dress",
  fashionItemCategory: "Dresses"
}]);
```

**Order Parameters**

| Parameter | Type | Description |
| --- | --- | --- |
| `id` | String | Required. Unique order identifier. |
| `value` | Number | Total order value. |
| `tax` | Number | Tax amount. |
| `shippingCosts` | Number | Shipping cost. |
| `currency` | String | ISO currency code (e.g., GBP). |

**Product Parameters**

| Parameter | Type | Description |
| --- | --- | --- |
| `id` | String | Required. Unique product variant identifier (SKU) — a specific purchasable item including colour and size. Must match the variant identifier stored in the Mapp Cloud Product Catalog. |
| `fashionItemTitle` | String | Product name. |
| `cost` | Number | Price per unit. |
| `quantity` | Number | Quantity ordered. |
| `currency` | String | Currency code. |