Skip to content
Search
Section overview
The main search section renders search template content with controls for spacing, background media, borders, and responsive visibility. It acts as the primary wrapper for search results, filters, and pagination layouts.
Common use cases
- Building the default search results page.
- Applying consistent styling across search result cards and filter controls.
- Enabling responsive search filter experiences for desktop and mobile.
- Managing section-level background and border treatments.
Usage tips
- Validate both desktop and mobile filter behaviors after layout changes.
- Keep gap and spacing values practical for denser search result pages.
- Use background media only when result readability remains strong.
- Test visibility and snap settings across common viewport sizes.
Section settings
| Setting | Description |
|---|---|
| Enable background image or video | Turns on background media rendering for the section. |
| Image background desktop | Background image used on desktop. |
| Image background mobile | Optional background image override for mobile. |
| Video background | Optional background video source. |
| Show video on mobile | Enables background video playback on mobile devices. |
| Show entire image | Displays full image rather than cropping to fill. |
| Top spacing | Adds top padding to the section container. |
| Bottom spacing | Adds bottom padding to the section container. |
| Minimum height | Sets a minimum section height. |
| Gap size | Controls spacing between child layout elements. |
| Color scheme | Sets section background and text color treatment. |
| Color border | Sets section border color style. |
| Border position | Controls where borders appear. |
| Vertical alignment | Aligns content vertically within the section. |
| Enable margin | Applies global horizontal margin settings. |
| Enable header overlap | Allows section to overlap the header when enabled globally. |
| Scroll snap align | Applies scroll snap alignment when enabled globally. |
| Visibility | Controls device visibility (all, mobile, or desktop). |
Block settings
This section is limited to one private layout block:
_layout__search(limit: 1)