Search blocks by description or jump to a page.
A post grid paired with category tabs that filter the visible articles. Use it to help readers narrow a busy blog down to the topics they want.
Category Filter is a blog index section with an active filtering toolbar above a responsive article grid. A centered heading and short description sit at the top, followed by a toolbar row holding a category dropdown on the left and a text search field on the right. Below that, matched posts render in a three column card grid. Each card shows a cover image, a category badge, a title, an excerpt, a date and read time row, and a "Read more" button. When no posts match, the grid is replaced by an empty state message and a reset button. A "Load More Articles" button appears below the full unfiltered grid.
The heading, description, and all post data are independent copy you can replace freely. The category list is derived from the posts themselves, so adding or removing posts automatically adjusts the available filter options. The empty state message and the load more button can each be removed if your use case does not require them.
Reach for this block when your blog carries enough posts across distinct topics that readers benefit from narrowing the feed before they scroll. It suits a developer tools company well: engineers arriving at a resources hub want to jump straight to API guides, release notes, or tutorials without skimming unrelated content. The combined dropdown and keyword search covers both browsing and targeted lookup in one toolbar, which makes it more capable than a plain grid when the topic surface is broad.
A natural flow around it on a Marketing (Legacy) page:
Before
After
The block fits any library of categorized articles where readers arrive with different goals. A few concrete ways to use it:
Tip: keep your category list to six or fewer options so the dropdown stays scannable and no single filter bucket returns an empty grid.