Search Behavior Settings
Last updated
Last updated
The search experience is one of the most critical features of any modern eCommerce store. The Materia theme offers a flexible and fast search system with built-in styling, content targeting, trending suggestions, and collection highlights — all customizable.
Choose how the search input behaves when a user activates it.
Opens a centered, full-screen overlay with a clean and focused search experience.
Slides down from the top of the screen as a sleek drawer, allowing users to search without disrupting the rest of the layout.
These layouts are ideal for stores that want a modern, minimal search interface.
Control what kind of content the search bar returns when users enter a query.
Returns results across all indexed areas of your store:
Products
Blog Posts
Pages (e.g., FAQ, About, Shipping Info)
Use this mode if your store includes content-rich resources or educational materials.
Limits search results to products only, giving customers a fast and focused shopping experience.
Choose this if your site is product-heavy and you don’t need to surface blog or page content.
Controls how rounded the search input box looks.
Example: 8 creates subtle, modern curves.
Set the outline or highlight color that appears when the user clicks into the search bar.
Example: #636363 for a neutral dark gray.
Customize the background color of the popup or drawer when the search interface is open on desktop.
Example: #FFFFFF for a clean white layout.
When enabled, this shows smart suggestions as users type — helping them find relevant items faster.
Great for:
Seasonal trends
Popular products
New releases
Brand names
Add a list of commonly searched terms, separated by commas. These appear as suggestions below the input.
Example:
Try including your top-selling product names, product types, or brand categories.
Enter the collection titles you want to suggest below the search bar. These appear as quick-access links.
Example:
Trending pills are small buttons that display predefined search terms or collections. You can style them to fit your brand.
Example: #F4F4F4 (light gray)
Example: #2E2E2E (dark gray or near-black)
Adjust the curvature of pill-shaped buttons.
Example: 8 for a smooth modern look
Change the background color when a user hovers over a trending pill.
Example: #E9E9E9
Enable this setting to display the price of each product in the search result dropdown, helping users quickly compare without clicking through to product pages.
