Skip to main content

Dynamic filters

What you're building: filter groups that discover which facet they filter on at runtime, instead of naming it in the Designer.

For catalogues where the useful filters differ by category — shoes filter by size, monitors by screen size — and hard-coding every group is not practical.

What you need

  • Applies toA Div inside the browse wrapper

    The group.

  • Applies toThe group

    The facet name, resolved dynamically.

  • Applies toThe group

    Which index the facet lives in.

facet instead of field

An ordinary group names its facet with , set once in the Designer.

is the dynamic alternative: it accepts a facet name resolved when the group renders, which lets one authored group serve several facets.

Scoping

marks an element that supplies the facet context a dynamic group reads. Use it when the available facets depend on something else on the page — a chosen category, for instance.

Ordering and limits

Dynamic groups accept the same controls as any other: , , and the show-more labels.

Every facet must still be declared in Algolia

Resolving a facet name at runtime does not make it filterable. Each one has to be in Configuration → Facets, and a name that is not declared renders an empty group with no error.

Troubleshooting

SymptomCauseFix
The group is always emptyThe resolved facet is not declared in AlgoliaDeclare it
It filters the wrong fieldBoth field and facet are setUse one
Nothing resolvesNo scope element supplies the contextAdd scope-facet