# Search template

**Adding a Section**

<figure><img src="/files/10Y2S2EAewnZHQkNbJIG" alt=""><figcaption></figcaption></figure>

The section is static on the **Search page** template, it was added initially and cannot be removed.

## **Section settings**

### General

<figure><img src="/files/AuWPvrWKJkNR6m9gcBcf" alt=""><figcaption></figcaption></figure>

1. **`Heading`** - the setting allows you to set the heading;
2. **`Show color swatch in filters`** - the setting allows you to show or hide a color swatch in filters;
3. **`Show grid button`** - the setting shows the user grid selection buttons where they can choose to display 3 or 4 cards in a row;
4. **`Filters type`** - the setting allows you to choose the location of filters on the search page, there are two options horizontal or in the drawer;
5. **`Paginate by`** - the setting allows you to specify the number of results in the search sidebar;
6. **`Pagination type`** - the setting allows you to select the type of pagination. Has several meanings:
   * **`Pagination`** - default pagination of elements;
   * **`Load more`** - loading a group of elements on a button click;
   * **`Infinite scrolling`** - loading elements on scroll.

#### Colors

<figure><img src="/files/KL5lYDmZq7WVkVfbO5Tk" alt=""><figcaption></figcaption></figure>

1. **`Enable products colored background`** - a setting that enables a custom background color and text color for product cards;
2. **`Product cards background`** - default card background color;
3. **`Product cards color`** - default card text color;

### Layout

<figure><img src="/files/QPjBG1jxIjX98U9THCKT" alt=""><figcaption></figcaption></figure>

1. **`Make full width`** - if disabled - container width will be set based on the group 'Layout' settings in the Theme settings;
2. **`Desktop offset top`** - the **top** indent of the section on the **desktop**;
3. **`Desktop offset bottom`** - the **bottom** indent of the section on the **desktop**;
4. **`Mobile offset top`** - the **top** indent of the section on the **mobile**;
5. **`Mobile offset bottom`** - the **bottom** indent of the section on the **mobile**.

### **Additional information**

1. Learn more about **Shopify Filtering**: <https://help.shopify.com/en/manual/online-store/themes/customizing-themes/storefront-filters>
2. When you change the color of the text, you may encounter a situation where in Select sorting the color of the icon does not change.

<figure><img src="/files/vZkZ9PpVnvH6NpbW982S" alt=""><figcaption></figcaption></figure>

This happens because the icon is added with a picture. To change the color of the icon, you need to go to `Edit code` → `Assets` → `icon-select.svg` and delete the current icon, then add a new one with the desired color. The main condition is that it has the same name - `icon-select.svg`.


---

# 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://utd-bv.gitbook.io/manual-shopify-theme-ultra/templates/search-template.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.