Predictive search
Predictive search when enabled occurs in the search bar in the site header. When a search term is entered, it will automatically look for matches as you type. A major update to predictive search was released with Whisk version 3.0.0, and you'll find documentation below for this version, as well as the previous version.
Whisk 3.0.0 and later
In early 2023, Shopify released updated features for predictive search which include query suggestions. We updated our predictive search to include these, as well as adding search results beyond just products. You can also show results for pages, collections, and articles. https://help.shopify.com/en/manual/online-store/storefront-search/predictive-search
You can manage and customize what results show up in your results through Shopify's free Search & Discovery app Below is a screenshot of the setting where you can customize search results.
Within the "Theme Settings" in Whisk, there are the following customizations for Predictive Search:
Enable product suggestions in the header search bar
Check this box to turn predictive search on. If it is unchecked, the search bar will take the visitor to the search page to see results after they click enter, but not automatic matches will be shown.
Products
Show product vendor
Check this box to show the product vendor in the predictive search results
Show product price
Check this box to show the product price in the predictive search results
Collections
Image
Here you can choose which image you'd like to show on the collection card.
Featured image
This is the collection image. If one does not exist on the collection, then the featured image of the first product in that collection will show. If there is no image on that product, then the background placeholder color/gradient will show.
First product image
The featured image on the first product in the collection. If there is no image on that product, then the background placeholder color/gradient will show.
Custom image
Create a custom metafield on collections where you can upload a new photo to use. See the bottom of this page for detailed instructions on how.
Font color
Color of the text on the card
Overlay color
Color of the slightly transparent overlay over the image.
Overlay opacity
Select the percentage of transparency you want to apply to the overlay color. A higher number is a more opaque/solid color.
Whisk v 2.0.0 and earlier
Here are the options you can configure for predictive search in Theme settings.
Enable product suggestions in the header search bar
Check this box to turn predictive search on. If it is unchecked, the search bar will take the visitor to the search page to see results after they click enter, but not automatic matches will be shown.
Show product vendor
Check this box to show the product vendor in the predictive search results
Show product price
Check this box to show the product price in the predictive search results