Search

Two things wear the Search name in Signal, and they are separate pieces:

1. The search results page — this section, on the search template.
2. The search overlay — rendered once for the whole store and opened by the header’s magnifier on every page.

Section settings

Setting	Type	Default	What it does
Eyebrow	Text	Search	Small accent line above the heading
Heading	Text	What are you after?	The heading shown when there is no query. With a query, the query itself becomes the heading
Placeholder	Text	Search the store	Placeholder in the page’s own search field
Columns	Range 2–6	4	Columns in the results grid
Products per page	Range 8–48, step 4	24	Results per page
Enable filtering	Checkbox	true	Show the filter button and drawer
Enable sorting	Checkbox	true	Show the sort dropdown
Empty heading	Text	No matches	Heading when nothing matched
Empty button label	Text	Shop everything	Button under that heading

The results page

Until a query is submitted the page shows only its masthead and search field — no empty grid, no zero-results message.

With a query, the masthead shows the query as the heading and the result count beside the field, then the toolbar, then the grid.

Results are mixed-type. Products render as the shared product card, identical to the collection grid. Everything else — pages, articles, collections — renders as a text result: the object type as an accent label, the title in display type, and 130 characters of stripped content.

Filtering and sorting work exactly as they do on a collection: the same filter drawer, the same sort control, the same numbered pager. The search page does not offer load-more or infinite scroll — results are paginated.

Search filters need to exist first

enable_filtering only has an effect when search.filters is populated, which means filters configured in Shopify’s Search & Discovery app. With none configured, the button simply does not render.

The search overlay

A full-screen dialog over the coal ground, opened by any [data-search-open] control — the header magnifier on every page. It locks page scroll, focuses the field, and closes on Escape, the close button or a click on the backdrop.

Before a key is pressed

An empty search overlay is a dead end, so the overlay shows two things while the field is empty:

• Recent searches — up to 5, remembered by that shopper’s own browser, with a Clear control. They are stored only when a search is actually submitted, not on every keystroke — a half-typed word is not a search. The list is this browser’s only, never sent anywhere, and the shopper can clear it.
• Popular searches — chips from the global Layout → Popular searches setting, a comma-separated list (demo: Jacket, Ski mask, Travel pack).

Predictive results

1. Typing debounces for 220ms, and nothing is fetched below 2 characters.

2. The overlay calls /search/suggest.json for products, pages, articles and collections — with resources[limit]=4 and resources[limit_scope]=each.

3. Products render first with a thumbnail, title and price. Then pages, articles and collections render as grouped plain rows under accent headings.

4. Pressing Enter goes to the full results page for the query.

Why limit_scope matters

Without limit_scope=each, Shopify applies the limit to the whole response — so a query matching 4 collections, 8 pages and 3 articles surfaced two collections, one page and one article. Per-type limits preview each group properly.

The results list is morphed rather than rebuilt on each keystroke: a result still present after the next character stays put, so its thumbnail is not re-requested and the list does not flash as the shopper types. When nothing matches, a single line invites them to press Enter for the full search.

Prices from suggest.json arrive as a bare decimal with no symbol, so the overlay formats them itself using the storefront’s active currency.

Related

• Collection — same toolbar, filter drawer and grid
• Header — where the overlay is opened from