Predictive search

Sieve includes a predictive product search: a search box that shows matching products in a dropdown as the shopper types. It is a separate widget from the faceted filter, so you can place it anywhere - in a header, on a landing page, or above an archive.

Placement

Use the shortcode:

[sieve_search]

Or add the Sieve Search block in the editor. Both render the same accessible search box.

Shortcode attributes

Attribute	Default	Description
placeholder	Search products	Placeholder text shown in the empty input.
button	yes	Show the submit button next to the input.
button_text	Search	Label for the submit button.
limit	6	Maximum number of suggestions in the dropdown (1-20).
min_chars	2	Characters required before suggestions appear (1-10).
in_stock_only	yes	Restrict suggestions to in-stock products.

Example:

[sieve_search placeholder="Find products…" limit="8" in_stock_only="no"]

How it works

As the shopper types, Sieve requests matches from a public REST endpoint and renders a dropdown of products with a thumbnail, name, SKU and price. Each result links straight to the product, and a “view all results” link opens the full search page.

Suggestions are built on WooCommerce’s own product search, so they respect catalog visibility and stay correct as your catalog grows. The search script is a small, standalone bundle: pages that only use [sieve_search] never load the faceted filter engine, which keeps them fast.

What it matches

The dropdown looks beyond product titles:

• Titles and SKUs, matched against a pre-built, diacritic-folded token index.
• Categories. Product categories whose name matches the term appear as their own group in the dropdown, linking straight to the filtered category archive. This lets a shopper jump to a whole category instead of a single product.
• Descriptions and content through WooCommerce’s own relevance search, used as a fallback when the token index finds nothing.

When both products and categories match, the dropdown shows two labelled groups (Categories and Products). Keyboard navigation moves through both.

Diacritic-insensitive and typo-tolerant

Matching ignores diacritics: a shopper typing lozko finds łóżko, and zolty finds żółty. This works in both directions, so it does not matter whether the shopper or the product name uses the accented characters.

Small typos are tolerated too. A query like zoltyy still finds żółty, because Sieve compares the typed word against similar product words and accepts a close match. Categories are matched the same diacritic-insensitive way.

Both the product text and the query are normalised the same way into a fast token index, so this stays quick even on large catalogs. Installing or updating to this version rebuilds the search index once in the background.

Search as a filter

The standalone [sieve_search] box above navigates to a product or the search page. Inside the faceted filter, search behaves differently: it is a filter. Add a Search facet to your [sieve] filter and the shopper can type to narrow the live product grid in place, combined with every other facet.

• The grid narrows as you type. Like any other facet, the results update live without a page reload, and the typed term is reflected in the URL (so it is shareable and survives back/forward).
• Same diacritic- and typo-tolerant index. In-grid search uses the exact same folded token index as the dropdown, so the grid and the suggestions always agree: lozko narrows the grid to łóżko, and a small typo still matches.
• A predictive dropdown assists. A thin suggestion list appears under the input for keyboard selection; picking a suggestion sets a precise term and re-filters the grid in place (it does not navigate away).
• It is a removable filter. The active search shows as a chip in the toolbar next to your other filters; clearing the chip (or emptying the box) restores the full grid.
• Counts stay honest. Other facet counts update to reflect the searched set, so you never see an option that would lead to zero results.
• Scoped suggestions. When other facets are active, suggestions are constrained to that selection, so a search “within” the current filters only proposes products that are actually reachable.

In-grid search matches titles and SKUs through the index. Products that would only match on their description text are reached through the standalone [sieve_search] widget rather than the in-grid filter.

Accessibility

The search box follows the ARIA combobox pattern:

• The input is a combobox controlling a listbox of options.
• Category and product suggestions are exposed as labelled groups within the listbox.
• Arrow Down / Arrow Up move through all suggestions (categories and products), Enter opens the active one, Escape closes the dropdown.
• The active option is tracked with aria-activedescendant for screen readers.
• With JavaScript unavailable, the box submits to the standard WooCommerce product search, so it always works.

Performance

• Requests are debounced while typing, and an in-flight request is cancelled when a newer keystroke arrives.
• Thumbnails load lazily.
• No layout shift: the dropdown is absolutely positioned and reserves no space until it opens.