> For the complete documentation index, see [llms.txt](https://help.brickspacelab.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.brickspacelab.com/space/sections/content-and-media/search-banner.md).

# Search banner

### Section overview

The Banner Search section displays a visually appealing banner with an integrated search field, allowing users to search your store from a prominent position on your page.

#### Common use cases

* Creating a visually striking search page header
* Highlighting search functionality on collection or category pages
* Adding a prominent search feature to landing pages
* Providing visual context to search results pages

#### Usage tips

* Use high-quality images that contrast well with the text overlay to ensure readability
* Keep the banner height appropriate for the page context - larger for hero sections, smaller for supporting content
* Consider enabling the gradient overlay to improve text visibility over busy background images
* For mobile users, use a dedicated mobile image with simpler composition to maintain usability on smaller screens

### Section settings

| Setting                   | Description                                                         |
| ------------------------- | ------------------------------------------------------------------- |
| Y spacing                 | Controls the vertical height of the banner                          |
| Image background desktop  | Background image displayed on desktop devices                       |
| Image background mobile   | Background image displayed on mobile devices                        |
| Video background          | Background video to display behind the search field                 |
| Show entire image         | Shows the entire image instead of cropping to fill the container    |
| Show video on mobile      | Determines if video background is visible on mobile devices         |
| Color scheme              | Sets the color scheme for the section background                    |
| Text color                | Sets the color of text elements                                     |
| Border color              | Sets the color of any borders                                       |
| Button color              | Sets the color style of the search button                           |
| Enable gradient           | Adds a gradient overlay to improve text visibility                  |
| Enable background overlay | Adds a background behind the text for improved readability          |
| Border position           | Sets the position of borders around the section                     |
| Y alignment               | Controls vertical alignment of content within the banner            |
| X alignment               | Controls horizontal alignment of content within the banner          |
| Enable header overlap     | Allows the header to overlap with the banner                        |
| Enable margin             | Adds horizontal margin to the section content                       |
| Enable max width          | Limits the width of the content for improved readability            |
| Visibility                | Controls whether the section is visible on mobile, desktop, or both |
| Enable search             | Toggles the display of the search field                             |

### Block settings

This section does not contain any blocks.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://help.brickspacelab.com/space/sections/content-and-media/search-banner.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.