Skip to main content
The search results page is built from a single Search section. It shows the number of results and the query, a toolbar with breadcrumb, filters and sorting that mirrors the Collection Page (PLP), and a grid that mixes product cards with compact cards for matching articles and pages. Card blocks let you place a promotional card, for example a link to a help article, at a chosen position in that grid, and a separate no-results state guides customers back to the catalog. You edit it by opening the Search template in the Theme Customizer. The instant results that appear while typing in the header are a different section; see Predictive search. Olympus search results page with the result count, filters and a mixed grid of product and article cards

​
What this template controls

  • Results per page and the wording of the result count and breadcrumb
  • Filtering (Drawer, Sidebar or Horizontal), sorting and the filter bar corners
  • Results per row on desktop and mobile
  • How article and page results are labeled and colored
  • The heading, text and button of the no-results and empty-query states
  • Color scheme, width, spacing and borders

​
Getting started

1

Open the Theme Customizer

From Shopify admin go to Online Store → Themes and click Customize on Olympus.
2

Choose the Search template

Use the page selector and pick Search. Run a search in the preview to see results, or leave the query empty to see the prompt state.
3

Select the Search section

Adjust its settings, and add Card blocks under the section to place promo cards in the grid.
Search section selected in the Theme Customizer

​
Template settings

Result count, breadcrumb and filtering settings of the Search section
The header prints the number of results followed by Text (default “results for”) and the search term as the page heading, for example 12 results for “linen”. The toolbar breadcrumb reads Home › Label (default “Search results page”).
Filters are Shopify’s native storefront filters as published in the Search & Discovery app. Enable filtering (on by default) shows them; Filter layout places them in a Drawer (default), a Sidebar with its own Color scheme, or Horizontal dropdowns in the toolbar with Filters shown inline (1 to 3; default 3) before a More filters button. Open only the first filter collapses every group except the first. On mobile every layout opens the filters in a slide-in drawer. Applied filters appear as removable pills above the grid with a Clear all link.Filters and sorting apply automatically about half a second after a change, with no Apply button to press. Only the results grid is fetched again while the rest of the page stays put, and the grid dims while the new results load. The address bar is updated with the active filters, so the back and forward buttons step through filter states and a filtered search can be shared or bookmarked.
Enable sorting (on by default) adds a Sort by dropdown. Filter bar corners styles the controls: None (no border), Theme default, Sharp, Rounded or Bordered, which keeps the theme corners and draws a box around the Sort by control.

​
Blocks

The Search section accepts one block type, Card, which can be added several times.

​
Card

A promo card placed at position three in the search results grid A Card is a promotional tile interleaved with the results, using the same compact style as article and page results. Use it to point searchers at a size guide, a shipping FAQ or a seasonal landing page, whatever they typed.
  • Position (1 to 24; default 3): the grid slot the card occupies. A position greater than the number of results puts it at the end.
  • Label (default “Article”): the small type label above the title.
  • Heading (default “Title of the featured article”) and Text: the card’s title and short description.
  • Link and Button label (default “Read more”): where the card leads and the action text.
  • Color scheme (default scheme 4): the card’s colors, independent from the article and page results.
Cards appear on every results page and every filtered state, because their position refers to the grid rather than to a specific result. Keep them relevant to any query.

​
Best practices

Match the collection page

Use the same filter layout, columns and filter bar corners as the Collection Page (PLP) so customers move between the two without relearning the controls.

Write the no-results copy carefully

Suggest a next step, such as browsing categories or checking spelling. The Continue Shopping button already leads to all products.

Use Card blocks for help content

A card linking to shipping or sizing answers catches searches that are really support questions.

Differentiate content results

Keep the article and page color scheme visibly different from the product cards so customers can scan for products first.

Publish filters that apply store-wide

Search results span every collection, so filters such as price, availability and product type work better here than collection-specific ones.

Predictive search

Instant suggestions shown while the customer types in the header

Collection Page (PLP)

The same filtering and sorting controls on collection pages

Pagination

Numbered pagination or a Load more button for the results grid