Event Tracking

Page views are tracked automatically once the Insights script is added to your site. For tracking user interactions like clicks and impressions, add data-insights-* attributes to your HTML elements.

This declarative approach keeps tracking logic out of your JavaScript and makes it easy to add tracking to any component.

Required Attributes

To track an element, add these three attributes:

Click Tracking

Track button clicks, link clicks, or any clickable element:

<button
  data-insights-track="click"
  data-insights-category="button"
  data-insights-id="signup-cta"
>
  Sign Up
</button>

This produces an event with the following structure:

{
  "event_category": "click",
  "event_data": {
    "category": "button",
    "id": "signup-cta"
  },
  "timestamp": 1704067260000
}

Impression Tracking

Track when elements become visible in the viewport. Impressions fire when at least 10% of the element is visible:

<div
  data-insights-track="impression"
  data-insights-category="product"
  data-insights-id="featured-product"
>
  <h3>Protein Shake</h3>
  <p>High-performance protein shake for athletes</p>
</div>

Custom Attributes

Add any additional data using custom data-insights-* attributes:

<button
  data-insights-track="click"
  data-insights-category="button"
  data-insights-id="add-to-cart"
  data-insights-product-id="SKU-12345"
  data-insights-price="29.99"
>
  Add to Cart
</button>

Custom attributes are included in the event_data object:

{
  "event_category": "click",
  "event_data": {
    "category": "button",
    "id": "add-to-cart",
    "productId": "SKU-12345",
    "price": "29.99"
  },
  "timestamp": 1704067260000
}

Note: Attribute names are converted from kebab-case to camelCase (e.g., data-insights-product-id becomes productId).

Dynamic Content

Elements added to the page after initial load are automatically detected. No additional configuration is needed for single-page applications or dynamically loaded content.

Next Steps

• Page Types - Configure page type tracking for richer analytics
• JavaScript API - Programmatic tracking for advanced scenarios