Skip to main content
Sends a browse result click event to Constructor.io’s API. This tracks when a user clicks on a product that appeared on a browse or category page.

​
Method Signature

constructorio.tracker.trackBrowseResultClick(parameters, networkParameters?)

​
Parameters

​
parameters
object
required
Parameters for the browse result click event
​
networkParameters
object
Optional parameters for the network request

​
Returns

Returns true on success or an Error object if validation fails.

​
Examples

​
Basic Example

import ConstructorIOClient from '@constructor-io/constructorio-client-javascript';

const constructorio = new ConstructorIOClient({
  apiKey: 'YOUR_API_KEY',
});

// Track browse result click
constructorio.tracker.trackBrowseResultClick({
  filterName: 'category',
  filterValue: 'Running Shoes',
  itemId: 'SHOE-001',
  itemName: 'Ultra Runner Pro',
});

​
Complete Example

// Track browse result click with all parameters
constructorio.tracker.trackBrowseResultClick({
  filterName: 'brand',
  filterValue: 'Nike',
  itemId: 'SHOE-001',
  itemName: 'Air Max 90',
  variationId: 'SHOE-001-SIZE-10',
  resultId: '019927c2-f955-4020-8b8d-6b21b93cb5a2',
  resultCount: 45,
  resultPage: 2,
  resultPositionOnPage: 5,
  numResultsPerPage: 20,
  selectedFilters: {
    brand: ['Nike'],
    color: ['blue'],
    size: ['10'],
  },
  section: 'Products',
  slCampaignId: 'Campaign 123',
  slCampaignOwner: 'Store 123',
});

​
Integration Example

// Track when user clicks on a browse result
const browseResults = document.querySelectorAll('.browse-result');
const filterName = 'category';
const filterValue = 'Laptops';
const resultId = window.browseResultId; // From browse API response

browseResults.forEach((result, index) => {
  result.addEventListener('click', () => {
    const itemId = result.dataset.itemId;
    const itemName = result.dataset.itemName;
    
    constructorio.tracker.trackBrowseResultClick({
      filterName: filterName,
      filterValue: filterValue,
      itemId: itemId,
      itemName: itemName,
      resultId: resultId,
      resultPositionOnPage: index,
    });
  });
});

​
Example with Sponsored Listing

// Track sponsored listing click
constructorio.tracker.trackBrowseResultClick({
  filterName: 'category',
  filterValue: 'Coffee',
  itemId: 'COFFEE-PREMIUM',
  itemName: 'Premium Roast Coffee',
  resultId: '019927c2-f955-4020-8b8d-6b21b93cb5a2',
  slCampaignId: 'fall-campaign-2024',
  slCampaignOwner: 'Brand-X',
});

​
When to Use

Call trackBrowseResultClick() when:
  • A user clicks on a product in a category page
  • A user clicks on a product in a brand page
  • A user clicks on a product in a collection page
  • A user clicks on any product in faceted navigation results

​
Important Notes

  • Always include the resultId from Constructor.io’s browse response
  • The filterName and filterValue must match what was passed to trackBrowseResultsLoaded
  • Both itemId and itemName are required
  • Track this event before navigating away from the browse page
  • The resultPositionOnPage should be 0-indexed (first item = 0)

​
Filter Name Consistency

Ensure filterName and filterValue match between events: 
// When loading browse results
constructorio.tracker.trackBrowseResultsLoaded({
  filterName: 'category',
  filterValue: 'Electronics',
  // ... other parameters
});

// When clicking a result - use the same filterName and filterValue
constructorio.tracker.trackBrowseResultClick({
  filterName: 'category',  // Must match
  filterValue: 'Electronics',  // Must match
  itemId: 'ITEM-123',
  itemName: 'Product Name',
});

​
Position Tracking

Tracking the position helps understand which results get the most clicks: 
constructorio.tracker.trackBrowseResultClick({
  filterName: 'brand',
  filterValue: 'Nike',
  itemId: 'SHOE-001',
  itemName: 'Running Shoe',
  resultPositionOnPage: 2,  // Third item on page (0-indexed)
  resultPage: 1,
  numResultsPerPage: 20,
});

​
Relationship with Other Events

Track these events in sequence:
  1. trackBrowseResultsLoaded - When browse page displays
  2. trackBrowseResultClick - When user clicks a result (this method)
  3. trackConversion - If the click leads to a conversion

​
API Endpoint

This method sends a POST request to: 
/v2/behavioral_action/browse_result_click

Build docs developers (and LLMs) love

Get started for freeTalk to us