FRAMER COMPONENT / EDITION 01
List sort and count
Framer’s dynamic filters are good. They just don’t sort, don’t count, and leave nothing behind when everything is filtered out. This adds those three things, and a clear-all, without replacing a single filter you already have.
Free
No licence fee. Yours for your own and client projects.
Get it free ↗
← Collection
A CLOSER LOOK
Twelve objects, sorted and counted.
HIGHLIGHTS
Inside the edition.
01
Sort by date, number or text
Up to eight options, ascending or descending, read from a layer you name or auto-detected from the rendered text.
02
A live result count
Write it as {n} result{s} of {total}. It updates as filters change and is announced politely to screen readers.
03
An empty state, and a clear-all
A designed empty state when every item is filtered out, and a clear-all that resets every filter through Framer’s own Reset variables action.
PUT IT TO WORK
A useful starting point.
01
Drop it in
Paste the component link into your project and drop an instance above your collection list.
02
Name two layers
Name the collection list layer Items and the repeated item Item, or type your own names into List layer and Item layer.
03
Add your sort options
A label, the layer that holds the value, the kind and the direction. Leave the field empty to auto-detect.
THE DETAILS
Before you begin.
FORMAT
Framer code component.
DESIGNED FOR
Anyone using Framer’s native filters with a CMS grid for work, objects, articles or products who needs sorting, a result count and an empty state.
REQUIRES
Framer, any plan.
LICENSE / STANDARD
Standard licence for your own projects and client work. No redistribution.
AVAILABILITY
Available free
