> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.ecomx.co/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Electro How to Use Electro Search Template

**Theme:** Electro · **Section type:** Search template

The Search template controls the page customers see after they search your store. It shows a search box, tabs for products, blog posts, and pages, and the product results with filters and sorting.

> **Note:** The Search template has 1 fixed section: **Search page**. You can hide it, but you can't remove it. You can add, remove, and reorder any other section on this template.
![Search results page with the search box, result tabs, Filter button, and sort menu (Electro preset)](https://storage.crisp.chat/users/helpdesk/website/-/f/8/b/b/f8bb8da391016800/search-1_1lkdgii.png)

**What you can do**
- Open the Search template
- Set up the search results
- Let customers filter and sort results
- Choose which result types appear
- See what customers see
- Change the Search page settings
- Fix common problems

---

## Open the Search template
1. In the theme editor, open the page selector at the top of the screen.
2. Click **Search**.
3. In the left sidebar, click **Search page**.

## Set up the search results
1. At the top of the section settings, choose a **Color scheme** and a **Heading size** for the "Search results" heading.
2. Under **Layout**, set **Items per page**. Pagination appears when there are more results than this.
3. Set **Items per row on large screen** and **Product results per row on mobile**.
4. Choose how **Quick buy** works on the product cards: Don't use, Standard (variant picker), or Bulk order (all variants).
5. Under **Page card**, set the **Overlay opacity** for page results.
6. Click **Save**.

> **Tip:** Use the **Search & Discovery** app in the Shopify admin to fine-tune which products appear in search results, for example with synonyms and product boosts.

## Let customers filter and sort results
1. Under **Filter and sort**, check **Enable product filter** and **Enable sort**.
2. Choose a **Filter and sort layout on large screen**: Sidebar, Topbar, or Drawer.
3. Optional: check **Expand all filters by default** to open every filter group.
4. Click **Save**.

The filters themselves come from the **Search & Discovery** app in the Shopify admin. Add, remove, or reorder them there.

## Choose which result types appear
Products always appear in search results. You choose whether blog posts and pages appear too.

1. In the theme editor, click **Theme settings** > **Search**.
2. Under **Search results**, check or uncheck **Blog posts** and **Pages**.
3. Click **Save**.

> **Note:** **Theme settings** > **Search** also controls the search panel that opens from the header. In Electro 3.5.0 and later, it can show **Search suggestions** (popular searches, products, and collections) before customers type anything. See "Electro Theme Settings" for these settings.

## What customers see
- **Search box:** the search terms appear in a search box at the top, so customers can change them and search again.
- **Tabs:** Products, Blog posts, and Pages tabs show the number of results in each. Customers click a tab to switch between result types.
- **Filters and sort:** a Filter button, a top bar, or a sidebar, depending on the layout you choose. The number of products and a sort menu sit above the results.
- **Results:** products appear as product cards. Blog posts show up to 5 per row on large screens. On mobile, blog posts and pages show 1 per row.
- **Quick buy:** with Standard, the **Quick Buy** button opens a popup where customers pick a variant. With Bulk order, the popup lists all variants.
![Filter drawer open on the search results page (Electro preset)](https://storage.crisp.chat/users/helpdesk/website/-/f/8/b/b/f8bb8da391016800/search-2_6xv3g9.png)

## Settings reference
### Top of the section
| Setting | What it does |
| ---- | ---- |
| Color scheme | Sets the colors of the section. Edit schemes in Theme settings > Colors. |
| Heading size | Sets the size of the "Search results" heading: Headline, H1, H2, or H3. |

### Layout
| Setting | What it does |
| ---- | ---- |
| Items per page | Sets how many results show on each page, from 8 to 24 in steps of 4. |
| Items per row on large screen | Shows 3, 4, 5, or 6 results per row. Blog post results show up to 5 per row. |
| Product results per row on mobile | Shows 1 or 2 product results per row on mobile. Blog posts and pages always show 1 per row. |
| Quick buy | Sets how customers add products straight from the card: Don't use, Standard (variant picker), or Bulk order (all variants). |

### Filter and sort
| Setting | What it does |
| ---- | ---- |
| Enable product filter | Shows the filters. Set up the filters in the Search & Discovery app. |
| Enable sort | Shows the sort menu. |
| Filter and sort layout on large screen | Shows the filters in a Sidebar, a Topbar above the results, or a Drawer that opens from a Filter button. |
| Expand all filters by default | Opens every filter group instead of showing them collapsed. |

### Page card
| Setting | What it does |
| ---- | ---- |
| Overlay opacity | Darkens the image on page result cards, from 0 % to 100 %. |

## Troubleshooting
**Blog posts or pages don't appear in the results.**
Check **Theme settings** > **Search** > **Search results** and make sure **Blog posts** and **Pages** are checked.

**The filters don't appear.**
Check that **Enable product filter** is on. Filters are managed in the Search & Discovery app, so check that the app has filters set up.

**I set 6 items per row, but blog posts show 5.**
Blog post results show up to 5 per row on large screens to keep them easy to read.

## Related articles
- [Electro Theme Settings](https://help.ecomx.co/en/article/electro-theme-settings-2ubwqk/)
- [Electro How to Create Electro Collection Page](https://help.ecomx.co/en/article/electro-how-to-use-electro-collection-template-yh1jxm/)
- [Electro How to Use Electro Blog Template?](https://help.ecomx.co/en/article/electro-how-to-use-electro-blog-template-4j66nn/)
- [Electro Template](https://help.ecomx.co/en/article/electro-template-ho6wue/)