Filters, search and sort on any collection

Facets with counts, search, sort and pagination for Framer CMS collection pages, so big catalogs stay easy to shop. No search app, no code.

Start building freeRead the docs

What you can build with filters & search

Facets, search, sort and pagination.

01

Facets with counts

Size, colour, tags, price and availability facets, each showing how many products match before the shopper clicks.

  • Counts per option
  • Combine facets
  • Clear all in one tap
02

Search as you type

A search box that narrows the collection as the shopper types, on any Framer CMS collection page.

  • Instant results
  • Works with facets
  • Styled input
03

Sort and pagination for big catalogs

Sort by price or newest, then page through with numbers, load more or previous and next.

  • Sort and sort toggle
  • Numbered pages
  • Result counts

The 10 components

Open the FrameStoreKit plugin, drag one onto the canvas and style it in the right panel. Shopify data flows in.

All components
  • FiltersProShopifyFiltersBuilds advanced Shopify product filter rules for a collection.
  • FacetsProShopifyFacetsDisplays available product facet values and their result counts.
  • SearchProShopifySearchSearches the synced Shopify product catalog.
  • SortProShopifySortSorts Shopify product results by the selected catalog field.
  • Sort ToggleProShopifySortToggleToggles the active Shopify product sort direction.
  • PaginationProShopifyPaginationPages through filtered Shopify product results.
  • Previous / NextProShopifyPreviousNextProvides previous and next navigation for filtered product results.
  • Filter Result CountProShopifyFilterResultCountShows the number of products matching the active filters.
  • Active Filter CountProShopifyActiveFilterCountDisplays the number of active product filters.
  • Clear All FiltersProShopifyClearAllFiltersClears active Shopify product filters and search state.

Set up in 4 steps

The onboarding wizard walks you through it. The docs cover every Shopify setting with screenshots.

Filters & search guide
  1. 1Connect the collectionAdd Shopify Collection to your CMS collection page.
  2. 2Add the controlsDrop Facets, Search and Sort where you want them.
  3. 3Show resultsUse Result Count and Pagination for large catalogs.
  4. 4PublishFilters update the product list instantly.

Good to know

Counts per optionEvery facet shows how many products match.
Fully styleableChips, checkboxes and dropdowns take your fonts, colors and states.
Pro featureFilters and search are included in Pro and Lifetime.

Filters & search questions

Still unsure? Email us and a Framer + Shopify person will reply, usually the same day.

Yes. Facets combine, and Clear All Filters resets them.

Related features

Catalog syncProducts, variants, images and collections in Framer CMS. One click to refresh.Design controlFonts, colors, spacing and states on every component.Cart & checkoutCart drawer, discount codes, Shopify checkout and Shop Pay.

Say yes to the next Shopify project

Start free with 15 products. Upgrade when the client signs.

Start building free