This page is about version 2.16.9 of the app, which is not the most recent version. The latest stable version is 2.16.10.
DidYouMean
is a component used to suggest a possible misspelling correction to the current query.
Before you begin
Make sure you have added the search
app to your theme dependencies in the manifest.json
as shown below:
_10 "dependencies": {_10 "vtex.search": "2.x"_10 }
Check the Search app documentation for more details on this step.
Usage
Add the did-you-mean
block to the search-result-layout.desktop
or search-result-layout.mobile
. For example:
_10"search-result-layout.desktop": {_10 "children": [_10 "flex-layout.row#didyoumean",_10 ],_10 "flex-layout.row#didyoumean": {_10 "children": ["did-you-mean"]_10 }_10}
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 |
---|
didYouMeanPrefix |
didYouMeanTerm |