Result Counter

Shows how many products are visible, with configurable messages for search, favorites, and no-results states.

Last updated

August 14, 2026

How to use

Set Type to Default, Search, or Favorites — this decides which count the component tracks (total visible products, search results, or favorited products) and which pair of empty-state controls applies.
Write the ↳ Text template for the populated state — leave it empty for the count on its own, or write copy around it using {{value}} for the count (legacy: {{#}}); on Search, {{term}} is also available for the query.
Style the text with Font, Color, and Transform.
Use Preview to force the canvas to show the populated or empty state while you design — it has no effect in Framer's preview window or on the published site.

Writing the count and search-term text

Leave the ↳ Text field blank to simply display a number, or use {{value}} to display the number alongside your own text. On a Search-type instance, also use {{term}} to interpolate the customer's query, e.g. "12 results for '{{term}}'."

Contextual empty-state messages

`Type`	Empty when	Show/hide control	Text control
`Default`	The visible catalog (after filters/search) has zero products.	`No Results`	`↳ Text`
`Search`	No search query is active yet.	`No Query`	`↳ Text`
`Favorites`	The customer has no favorited products.	`No Favorites`	`↳ Text`

Each show/hide control defaults to hidden, so an instance with no configured empty-state copy simply disappears instead of showing a blank line.