« Search UI Autocomplete »
Elastic Docs ›Search UI

Overview

edit

Overview

edit

In ecommerce, to build great search experiences for your customers, you need to focus on these major experiences:

  • Global Search bar: to give customers the ability to perform a search on any page of your store.
  • Search Page: to give your customers a place to see results relevant to their query and refine them using facets.
  • Category Page: to show a list of products from a particular category to help users explore available products.
  • Product Carousel: to show a list of products within pages like the Homepage or Checkout, or if a query returns no results.
  • Product Detail Page: to describe the product and provide cross-sell recommendations, like similar products from the same category or "frequently bought with" items.

Below you can see a demo of an ecommerce store built with Search UI. We’re going to use it to demonstrate different concepts in the next several articles.

Full code of this demo is available here: https://github.com/elastic/search-ui/tree/main/examples/sandbox, with the Ecommerce code located under pages/ecommerce.

Related Articles

edit
  • Autocomplete: Provide suggestions to customers as they type in a search query.
  • Search Page: Display products that match a customer’s search query.
  • Category Page: Show a list of products in a particular category.
« Search UI Autocomplete »