Widgets Introduction

Edit this page

Introduction to widgets

In InstantSearch.js, widgets are the building blocks of search UI.

In order to make your work efficient, InstantSearch.js it comes with a set of 18 widgets factories, functions that create widget instances. Each one of them is specialized by role: searchbox, pagination, numeric filters and so onโ€ฆ

Widgets can be added to the InstantSearch instance using the addWidget method.

const search = instantsearch(/* parameters here */);
search.addWidget(instantsearch.searchbox(/* searchbox parameters */));

In the next sections we showcase the widgets InstantSearch.js provides. If you want to learn more about the API, have a look at the common widget API.

Most common widgets

hits

Full documentation

hitsPerPageSelector

Full documentation

infiniteHits

Full documentation

Full documentation

Full documentation

Full documentation

Filtering widgets

hierarchicalMenu

Full documentation

menu

Full documentation

refinementList

Full documentation

numericRefinementList

Full documentation

numericSelector

Full documentation

priceRanges

Full documentation

rangeSlider

Full documentation

starRating

Full documentation

toggle

Full documentation

Clearing widgets

clearAll

Full documentation

currentRefinedValues

Full documentation

Sorting widgets

sortBySelector

Full documentation

Metadata widgets

stats

Full documentation

Analytics widgets

analytics

Full documentation

This widget does not have a displayed output.