Step 3: Registering Recommendation

After activating the Recommendation Tracking extension, you must register the elements on your website that you want to track as recommendations. This is required for all integration methods.

When a recommended product is displayed or clicked, the extension sends product details along with widget context (placement, algorithm, product position).

If the clicked product is purchased within seven days, the stored widget context is included in the purchase request. Attribution follows a last-click approach.

Register recommendation

Use add() to define the widget element and the product-specific data you want to send.

wtSmart.extension.recommendation_tracking.add({
  selector: "li.item:nth-of-type(2)",
  shadowRoot: "#product-collection",
  exclude: ["li.item:nth-of-type(2) a:last-child"],
  data: {
    id: "MP12",
    cost: 19.95,
    currency: "EUR",
    placement: "pdp",
    algorithm: "similar items",
    occasion: "casual",
    position: 3
  }
});

Note

Display events are triggered automatically as soon as elements matching the selector appear in the DOM. This also works for lazy-loaded content and SPA environments, as no separate view event is required.

Fields

Note

The extension listens for click events on all clickable elements inside the widget (a, area, button, input[type="submit"]).

Note

You must call add() for each widget you want to track.

Example

// register multiple products inside the same widget
document.querySelectorAll(".recos li.item").forEach((el, index) => {
  wtSmart.extension.recommendation_tracking.add({
    selector: el,
    data: {
      id: el.dataset.sku,
      cost: el.dataset.price,
      currency: "EUR",
      placement: "homepage",
      algorithm: "similar items",
      occasion: "casual",
      position: index + 1
    }
  });
});

Testing your implementation

To verify that recommendation events are firing correctly, use your browser’s developer tools or the Mapp Cloud debugger:

1. Open the page with a recommendation widget and start the Debugger.

2. Trigger the events (widget display, click, and later a purchase).

3. Check the outgoing requests and verify that the following values are sent: