# Search results

{% hint style="info" %}
**Language Support**

**Live search is only supported in certain languages.** When implementing live search functionality, be aware of the following:

* Full predictive search functionality works best with Latin-based languages (English, French, Spanish, etc.)
* Languages using non-Latin scripts (Chinese, Japanese, Arabic, etc.) may experience limited functionality
* Search results may not properly handle diacritical marks in some languages
* Right-to-left (RTL) languages are supported but may require additional styling adjustments
  {% endhint %}

#### Types of Search Components

Our themes offer several ways to implement search functionality:

1. **Search Drawer** - A slide-out search drawer with predictive search functionality.
2. **Search Banner** - A prominent search field on a customizable background.
3. **Header Search** - Simple search integration in the header section.

#### Common Features

* Predictive search results
* Search recommendations
* Filtering by resource type (products, collections, articles, pages)
* Customizable appearance

#### Performance Considerations

* Large product catalogs may experience slower search response times
* Search results are limited to a maximum number of items per category
* Mobile devices may have reduced functionality compared to desktop
* Search indexing can take up to 24 hours to reflect new content

### Search Drawer Settings

| Setting                     | Description                                                                 |
| --------------------------- | --------------------------------------------------------------------------- |
| Search recommendations      | Add suggested search terms that appear before a user begins typing          |
| Color scheme (top bar)      | Choose the color scheme for the search drawer's top navigation bar          |
| Border color (top bar)      | Set the border color style for the top navigation area                      |
| Color scheme (main section) | Select the color scheme for the main search results area                    |
| Border color (main section) | Choose the border color style for the main search results                   |
| Enable second column        | When enabled, displays product search results in a second column on desktop |

### Search Banner 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         | When enabled, displays the entire image within the banner area          |
| Show video on mobile      | When enabled, displays the video background on mobile devices           |
| Color scheme              | Sets the background color scheme for the section                        |
| Text color                | Controls the color of text within the section                           |
| Border color              | Sets the color of any borders applied to the section                    |
| Button color              | Sets the style and color of the search submit button                    |
| Enable gradient           | Adds a gradient overlay to help text stand out against the background   |
| Enable background overlay | Adds a background overlay behind the search content for better contrast |
| Border position           | Controls where borders appear on the section                            |
| Y alignment               | Controls the vertical alignment of content within the section           |
| X alignment               | Controls the horizontal alignment of content within the section         |
| Enable margin             | When enabled, adds horizontal margin to the section                     |
| Enable max width          | When enabled, applies a maximum width to the search content             |
| Visibility                | Controls which devices the section appears on                           |
| Enable search             | When enabled, displays the search input field                           |

### Header Search Settings

| Setting                 | Description                                    |
| ----------------------- | ---------------------------------------------- |
| Show search button      | Enable or disable search functionality         |
| Show search icon mobile | Choose to show search icon on mobile           |
| Search color scheme     | Select the color scheme for the search overlay |
| Search color border     | Choose the border style for the search overlay |


---

# Agent Instructions: Querying This Documentation

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

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.brickspacelab.com/keystone/guides/sitewide/search-results.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.