analytics - Algolia

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";

const { analytics } = instantsearch.widgets;
// or directly use instantsearch.widgets.analytics()

See this widget in action

Preview this widget and its behavior.

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 parameters": arrParams,
      },
    ]);
  },
});

Options

pushFunction

function

required

A function that is called every time the 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,
});

​Import

See this widget in action

​About this widget

​Examples

​Google Analytics

​Google Tag Manager

​Segment.io

​Kissmetrics

​Options

Import

About this widget

Examples

Google Analytics

Google Tag Manager

Segment.io

Kissmetrics

Options