Instant Search

Usage

Use the following code for every keystroke shoppers perform in a searchbox. The callback function will contain the relevant searches, products and categories matching the shopper term:

Example

window.FastSimonSDK.instantSearch({
    query: "shirt",
    callback: (response) => {
        // handle search results
    },
    articlesCallback: (response) => {
        // handle article results
    }
}); 

Options

Option	Type	Description
query	string (required)	the query you want results for
withAttributes	boolean	include product attributes
callback	(Response) => void (required)	callback to handle the search results
articlesCallback	(ArticlesResponse) => void	callback to handle article results (requires is_content)

Response

Typescript Typing

interface Response {
  action: "instantSearch"
  payload: {
    totalResults: number,
    categories?: AutocompleteCategory[],
    products: AutocompleteProduct[]
    turbolinks: AutocompleteTurbolinks[]
    popularSearches: PopularSearch[]
    query: string
    }
}

interface ArticlesResponse {
  action: "instantSearchArticles"
  payload: {
    articles: ArticleResponse[]
    query: string
  }
}

interface ArticleResponse {
  l: string  // label/title of the article
  u: string  // URL of the article
  t: string  // type of the article
}

Reporting Implementation (must for analytics)

Please follow the guideline to report shopper behaviour on the recommendation widget in order to get accurate Analytics in the Fast Simon dashboard as well as greater personalized accuracy

1. Autocomplete Events