Back to blog
Product4 min read

This blog is a filterable collection — built the same way yours would be

Author: Zitegen Team at Zitegen

There's a small irony in building a blog page for the tool that builds blog pages: we could have hand-rolled this one. We didn't, on purpose — because the feature that makes the category filter on the left work is exactly what ships on a generated site when you ask for one.

What's actually doing the filtering

Under data-zg-repeat-articles and data-zg-collection, a page can bind to a set of entries — articles, in this case — and a data-zg-filter directive scopes which category is active. The compiler resolves all of it at build time, the same marker-based approach the locale switcher uses. Ask chat for "a blog with a category sidebar" on your own site and it reaches for the same directive.

Why marker-based, not component-based

A component would mean shipping our exact card design onto every site that wanted filtering. A marker means the compiler resolves the behavior — the filtering logic, the scoping — while your styling stays yours. This page's cards look like Zitegen's brand because we styled them that way, not because the filtering feature has an opinion about amber accent colors.

If you're building a site with more than a handful of posts, products, or case studies, this is the feature to reach for before you reach for a plugin. It's already load-bearing on the page you're reading right now.

Ready to build your website?

Free to start, no credit card required.

Get started free