Suggestions is a component used to suggest search terms similar to the current query.

Usage

Add the search-suggestions block to the search-result-layout.desktop or search-result-layout.mobile. For example:

"search-result-layout.desktop": {
    "children": [
        "flex-layout.row#suggestion",
    ],
    "flex-layout.row#suggestion": {
        "children": ["search-suggestions"]
    }
}

Props

Prop nameTypeDescriptionDefault value
customPagestringDefines a custom page to the link of a suggestion. Example: store.search.custom. Defaults to store.search.

Customization

In order to apply CSS customizations in this and other blocks, follow the instructions given in the recipe on Using CSS Handles for store customization.

CSS Handles
suggestionsList
suggestionsListPrefix
suggestionsListLink
suggestionsListItem

Did this page help you?