A comprehensive search results block that provides real-time search functionality with keyboard navigation, suggestions, and displays results for multiple content types. Features a sticky search bar with input field, loading states, search suggestions, and organized results display for products, collections, pages, articles, and query suggestions.
Common use cases
Configure search resource types in theme settings to control what content appears in results
Add manual search link suggestions to help users discover content when starting their search
Use appropriate color schemes and border styles to match your theme design
Consider the number of search result types when configuring the layout
Set up customer access tags if you need to hide certain content from non-approved users
Ensure Alpine.js search store and helper functions are properly initialized
Test keyboard navigation functionality across different devices and browsers
Block settings
General
Setting
Description
Options
Show advanced settings
Reveals visibility settings
Checkbox (default: false)
Content
Setting
Description
Options
Placeholder
Placeholder text for the search input
Text input (default: Search for product)
Search recommendations
Link list of manual search suggestions to display when no search term is entered
Link list picker
Spacing
Setting
Description
Options
Enable horizontal padding
Adds horizontal padding around the search results
Checkbox (default: false)
Enable top padding
Adds top padding around the search results
Checkbox (default: false)
Enable bottom padding
Adds bottom padding around the search results
Checkbox (default: false)
Color
Setting
Description
Options
Color scheme
Controls the background and text color combination
