Adding Search Blocks to Your Squarespace Site
TL;DR:
- Add search blocks to help visitors find content quickly across your site
- Choose between searching all content or specific collections like blogs or galleries
- Use quick preview to show search suggestions as people type
- Match the search block theme (Light or Dark) to your page design
- Fix common issues like invisible text by adjusting the theme settings
Adding a search block makes your site easier to navigate, especially if you have lots of content. Here's how to set one up and customise it properly.
How to Add a Search Block
To add a search block to any page:
- While editing a page or post, click "Add Block" or find an insert point
- Select "Search" from the block options
- In the block editor, use the Content tab to choose what the search covers
You can either search all your site content or focus on specific collections like your blog or portfolio.
Customising Search Results
Global vs Collection-Specific Searches
Global Search: Leave 'Search Specific Page' unchecked to search everything on your site. This works well for general navigation.
Collection-Specific Search: Check 'Search Specific Page' and pick a collection from the dropdown. This is useful when you want visitors to search just your blog posts or product pages.
Quick Preview Feature
Quick Preview shows search suggestions as people type, which speeds up the search process. It's turned on by default, but you can toggle it off in the Display tab if you prefer a cleaner look.
Styling Your Search Block
Under the Display tab, you can set your search field to Light or Dark theme. Pick the one that contrasts well with your page background. Dark themes work on light backgrounds and vice versa.
Pixelhaze Tip: Add a text block above your search to tell people what they're searching. Something like "Search our blog" or "Find a product" makes the purpose clear.
Common Issues and Fixes
Can't see what you're typing? Your search block theme probably matches your background too closely. Switch from Light to Dark or the other way around in the block settings.
No search results showing up? Check that your content isn't password-protected and try clearing your browser cache. Sometimes browser extensions can interfere too.
Want a site-wide search at the top? You can't put search blocks above all page content, but you can add them to individual pages or create a dedicated search page and link to it in your main navigation.
FAQs
Can I add a search block to my header or navigation?
Search blocks can't go in headers, but you can create a search page and link to it from your main navigation menu.
Why aren't all my pages showing in search results?
Pages need to be published and not password-protected to appear in search results. Also, very new content sometimes takes a bit of time to show up.
Can I customise what information shows in the search results?
The search results format is set by Squarespace and shows page titles and excerpts. You can't change this layout, but you can optimise your page titles and descriptions to make results more helpful.
Jargon Buster
Search Blocks: Interactive elements that let visitors search your site content directly from any page
Collections: Groups of similar content like blog posts, products, or gallery images
Quick Preview: Shows potential search results as someone types, before they hit enter
Wrap-up
A well-placed search block makes your site more professional and user-friendly. It's particularly valuable if you have lots of content or run a blog. Take time to test your search function and make sure the styling works well with your design. If visitors can find what they need quickly, they're more likely to stick around and explore your site.
Ready to improve your Squarespace skills? Join the Pixelhaze Academy for more detailed tutorials and expert guidance.