Skip to main content
This widget is deprecated and only supported in InstantSearch.js versions 1.9 to 4.8. Use the insights middleware instead. For details, see the upgrade guide.
Signature
analytics({
  pushFunction: function,
  // Optional parameters
  delay?: number,
  triggerOnUIInteraction?: boolean,
  pushInitialSearch?: boolean,
  pushPagination?: boolean,
});

​
Import

import { analytics } from "instantsearch.js/es/widgets";
View demo

​
About this widget

The analytics widget pushes the current state of the search to the analytics platform of your choice. It requires the implementation of a function that pushes the data. This widget doesn’t render a UI.

​
Examples

​
Google Analytics

JavaScript
analytics({
  pushFunction(formattedParameters, state, results) {
    window.ga("set", "page", window.location.pathname + window.location.search);
    window.ga("send", "pageView");
  },
});

​
Google Tag Manager

JavaScript
analytics({
  pushFunction(formattedParameters, state, results) {
    dataLayer.push({
      event: "search",
      "Search Query": state.query,
      "Facet Parameters": formattedParameters,
      "Number of Hits": results.nbHits,
    });
  },
});

​
Segment.io

JavaScript
analytics({
  pushFunction(formattedParameters, state, results) {
    analytics.page("[SEGMENT] instantsearch", {
      path: "/instantsearch/?query=" + state.query + "&" + formattedParameters,
    });
  },
});

​
Kissmetrics

JavaScript
analytics({
  pushFunction(formattedParameters, state, results) {
    const objParams = JSON.parse(
      '{"' +
        decodeURI(
          formattedParameters.replace(/&/g, '","').replace(/=/g, '":"'),
        ) +
        '"}',
    );
    const arrParams = $.map(objParams, (value, index) => {
      return [value];
    });

    _kmq.push([
      "record",
      "[KM] Viewed Result page",
      {
        Query: state.query,
        "Number of Hits": results.nbHits,
        "Search Params": arrParams,
      },
    ]);
  },
});

​
Options

​
pushFunction
function
required
A function that is called every time the query or refinements changes. You need to add the logic to push the data to your analytics platform.The function takes three parameters:
  • formattedParameters. Contains the search parameters, serialized as a query string.
  • state. Contains the whole search state.
  • results. The last received results.
JavaScript
analytics({
  pushFunction(formattedParameters, state, results) {
    // send data to your analytics system
  },
});
​
delay
number
default:3000
The number of milliseconds between the last search keystroke and calling pushFunction.
JavaScript
analytics({
  // ...
  delay: 5000,
});
​
triggerOnUIInteraction
boolean
Triggers pushFunction after click on page or redirecting the page. This is useful if you want the pushFunction to be called for the last actions before users leaves the current page, even if the delay wasn’t reached.
JavaScript
analytics({
  // ...
  triggerOnUIInteraction: false,
});
​
pushInitialSearch
boolean
default:true
Triggers pushFunction when InstantSearch is initialized. This means the pushFunction might be called even though users didn’t perfom any search-related action.
JavaScript
analytics({
  // ...
  pushInitialSearch: true,
});