The searchabee theme block renders the filter UI on your storefront. It’s a Shopify Theme App Extension, so it installs via the standard theme editor.
1. Open the theme editor
Shopify Admin → Online Store → Themes → Customize.
2. Navigate to a collection template
In the template picker (top bar), switch to Collections → Default collection (or whichever template you want to configure).
3. Add the searchabee block
In the left sidebar, find the Products grid section (name varies by theme). Above or next to it, click Add block and choose searchabee Filters.
4. Position
Drag the block to where you want it to render — typically as a left sidebar on desktop and above the grid on mobile. The block is responsive and respects your theme’s container widths.
5. Block settings
- Filter tree: pick which tree to render (from the ones you’ve defined in the dashboard).
- Sort options: choose which sort options are visible (relevance, price, newest, best-selling).
- Initial state: expanded or collapsed on mobile.
6. Save and test
Save the theme. Visit the collection page on the live storefront. You should see filters render with real counts, and applying them should update the product grid without a full page reload.
Replace Shopify’s native filters
Many themes ship with Shopify’s native filter block enabled by default. Disable that block — having two filter UIs is confusing. searchabee does everything the native block does, plus catalog-wide scope.
Custom themes
If your theme doesn’t have a standard “Products grid” section, you can still add the block to any section that renders collection products. Reach out if the block isn’t appearing as expected — we’ve tested against major themes but custom themes sometimes need a one-line adjustment.