Search drawer

Section overview

The Search section provides a slide-out search drawer with predictive search functionality, allowing customers to quickly find products, articles, pages, and collections in your store.

Common use cases

• Adding a search function to your store's header

• Creating a prominent search experience for product-heavy stores

• Highlighting featured search terms or popular searches to guide customers

• Improving site navigation by making content easily discoverable

Usage tips

• Add search recommendations to guide customers toward popular items or categories

• Consider enabling the second column for desktop to show product results visually

• For mobile, the drawer appears from the bottom, making it easily accessible

• The search results are organized by type (products, pages, articles, collections) for clearer navigation

Section settings

Setting	Description
Search recommendations	Add suggested search terms that appear before a user begins typing
Color scheme (top bar)	Choose the color scheme for the search drawer's top navigation bar
Border color (top bar)	Set the border color style for the top navigation area
Color scheme (main section)	Select the color scheme for the main search results area
Border color (main section)	Choose the border color style for the main search results
Enable second column	When enabled, displays product search results in a second column on desktop

Block settings

Announcement

The Announcement block allows you to display promotional content or important messages at the top of the search drawer.

Block limit: 1

Setting	Description
Content	Rich text content for your announcement
Color scheme	Choose the color scheme for the announcement area
Horizontal alignment	Set the text alignment to left, center, or right