Note: While our most popular guides have been translated into Spanish, some guides are only available in English.

Search blocks

Use search blocks to add search fields to your site. You can show results from across your site or limit results to one collection page.

How search results populate

Like any search engine, search block results are based on the quality of content on your site. To improve results in search blocks, we recommend adding descriptive and accurate titles, descriptions, excerpts, tags, categories, file names, and keyword-rich content across your site.

For a full list of site content indexed for search, visit Adding search to your site.

Add a search block

To add a search block:

  1. Edit a page or post, click an insert point, and select Search from the menu. For help, visit Adding content with blocks.
  2. In the Content tab, you can limit results to a specific collection.
  3. Click Display to enable quick preview and style the search field.
  4. Click Apply to save your changes.

Select content to search

In the block editor, you can choose to show results from across your site or limit results to a specific collection.

Show search results from across your site

To show results from across your site, leave Search Specific Page unchecked.

Limit search results

To limit results to one specific collection:

  1. Check Search Specific Page
  2. Select one blog, events, gallery, or store Page from the list that appears below.
Tip: If you select Search Specific Page, you may want to note that the search block will return results for a specific collection. You can do this by adding a text block above the search block that says, for example, “Search our blog.”

Enable quick preview

Enabling quick preview adds a drop-down that auto-populates results as the visitor types. We recommend checking this to allow quicker access to search results.

Quick preview is enabled by default on search blocks. To disable this feature, click the Display tab in the block editor and uncheck Quick Preview.

Style the search field

In the display tab, select Light or Dark to customize how the search icon and field outline appear on your site. Dark is recommended for sites with light backgrounds. Light is recommended for sites with dark backgrounds.

Use the search block 

To use search blocks, place your cursor in the search field and begin typing.

If quick preview is enabled, results populate in a drop-down. The search looks similar to this:

Pressing Enter after entering text opens a page with search results. Recommended pages appear with their thumbnails, content snippets, and excerpts. If a page doesn’t have a thumbnail image, the first image on the page appears.

FAQ and troubleshooting

Can I add a site-wide search block to the top of my site?

It isn't possible to add search blocks above your page content, but you can add search blocks to individual pages. If your template supports it, the header content area is a good place to add it.

You can also add a Search link to your built-in search page to your main navigation or anywhere links are supported:

  1. Create a URL by adding /search to the end of your full domain so it looks like this:
  2. Add the URL to a web address link in your navigation or somewhere else like a text link, button block, or button in a special banner.

I can’t see the text I’m typing in the search field.

By default, the search block is set to the dark theme. If the page background is dark, the search text will blend in. The same can happen if the page background is white and the search block is set to the light theme.

To fix this, switch the theme to Light or Dark in the block’s display tab.

My search query isn’t generating results.

Try the following steps to generate search results:

If you're still not seeing results after following these troubleshooting steps, contact us, and we'll refresh your site's search on our end.

Was this article helpful?
47 out of 166 found this helpful