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:
- Edit a page or post, click an insert point, and select Search from the menu. For help, visit Adding content with blocks.
- In the Content tab, you can limit results to a specific collection.
- Click Display to enable Quick Preview and style the search field.
- 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:
- Check Search Specific Page.
- 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:
- Create a URL by adding /search to the end of your full domain so it looks like this: http://www.yourdomain.com/search
- 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:
- Clear your browser’s cache, as it could be loading an earlier version of your site. You can also disable browser extensions or try a different browser.
- Remove any passwords from pages with Search Blocks.
- Ensure that the content that we index for search includes terms in your search query.
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.