Skip to content

Base configuration

Dhaya edited this page Apr 4, 2022 · 2 revisions

This is the starting point of your project.

These options are necessary to integrate Unified InstantSearch E-commerce in your website, and wire it with your Algolia index.

appId

string | required

Your Algolia Application ID (find it on your Algolia account).

searchApiKey

string | required

Your Algolia search-only API key (find it on your Algolia account).

index

object | required

Your Algolia index settings:

Key Type Description
indexName string Your Algolia index name.
searchParameters SearchParameters The search parameters to use.

inputContainer

string | HTMLElement | required

The CSS selector or HTML element that targets the DOM element to inject the search button into.

This selector must refer to a container (e.g., <div>), not an <input>. Unified InstantSearch generates the <input> for you.

inputContent

string | ReactNode | required

The content to display in the search button.

keyboardShortcuts

string[]

The keyboard shortcuts to use to display the search overlay.

hitComponent

(props: { hit: Hit, insights: Insights, view: "grid"|"list" }) => JSX.Element | required

The hit component to display in the list of hits.

You have access to the following props:

Prop Type Description
hit Hit The hit returned by Algolia.
insights Insights The Insights function, already bound to the index, userToken, queryID, objectIDs and positions so that you only have to specify the eventName.
view "grid" | "list" The current view mode.