Search Behavior Settings
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.
Search Box Display Style
Choose how the search input behaves when a user activates it.
Popup Search Window
Opens a centered, full-screen overlay with a clean and focused search experience.
Sliding Drawer Search
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.
Search Results Type
Control what kind of content the search bar returns when users enter a query.
Search All Content (Products, Blogs, Pages)
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.
Search Only Products
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.
Search Input Customization
Search Bar Corner Roundness
Controls how rounded the search input box looks.
Example: 8 creates subtle, modern curves.
Search Bar Focus Color
Set the outline or highlight color that appears when the user clicks into the search bar.
Example: #636363 for a neutral dark gray.
Default Search Desktop Background Color
Customize the background color of the popup or drawer when the search interface is open on desktop.
Example: #FFFFFF for a clean white layout.
🔍 Search Suggestion Settings
Enable Trending Search Suggestions
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
Predefined Search Keywords
Add a list of commonly searched terms, separated by commas. These appear as suggestions below the input.
Example:
plaintextCopyEditdelimano, ai waterbottle, notesTry including your top-selling product names, product types, or brand categories.
Suggested Collections
Enter the collection titles you want to suggest below the search bar. These appear as quick-access links.
Example:
plaintextCopyEditBestselling, New Arrivals, Essentials Trending Pill Customization
Trending pills are small buttons that display predefined search terms or collections. You can style them to fit your brand.
Trending Pill Background Color
Example: #F4F4F4 (light gray)
Trending Pill Text Color
Example: #2E2E2E (dark gray or near-black)
Trending Pill Border Radius
Adjust the curvature of pill-shaped buttons.
Example: 8 for a smooth modern look
Trending Pill Hover Background Color
Change the background color when a user hovers over a trending pill.
Example: #E9E9E9
Additional Search Options
Show Prices in Search Results
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.
Last updated