10th Jul '25
/
0 comments

Category and Search Filtering for Nested Bricks Query Loops

This Pro tutorial provides the steps for adding a category names select dropdown and instant search input field for post titles (and excerpts, if present) so visitors can filter posts grouped by categories (or CPT posts grouped by a custom taxonomy) when using a Posts query loop nested inside a Terms query loop.

The solution incorporates:

  • Real-time category filtering with a dropdown interface
  • Instant search functionality that filters as users type
  • Combined filtering allowing users to search within specific categories
  • URL-based deep linking for clean URLs of shareable filtered results (?category=slug&search=term).
  • Custom post type compatibility that works with products, portfolios, events, or any post type
  • Custom taxonomy support for filtering by any taxonomy (categories, tags, or custom taxonomies)
  • A Reset button for the filters
  • No Results message for when there are no matching results
  • Browser back/forward button support

Step 1

Edit your Template or Page with Bricks.

Copy and paste the JSON of the fully-built Section from the link below.

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 618 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Upcoming Events in Bricks Grouped by ‘Month Year’ with Frontend Filtering by Event Type

Upcoming Events in Bricks Grouped by ‘Month Year’ with Frontend Filtering by Event Type

Updated version of the earlier Upcoming Events Grouped by ‘Month Year’ in Bricks tutorial with some improvements:
How to apply a custom query var to multiple query loops in Bricks

How to apply a custom query var to multiple query loops in Bricks

In this tutorial, we'll learn how to apply a PHP filter to modify the query var of multiple query loops in a single function Introduction…
Categories:
Pro
Posts Grouped by Authors in Bricks

Posts Grouped by Authors in Bricks

This Pro tutorial for Bricks users provides the steps to loop through users and inside that, through posts whilst setting the inner query's author parameter…
Pro
Nested Meta Box Query Loop Inside a CPT Query Loop in Bricks

Nested Meta Box Query Loop Inside a CPT Query Loop in Bricks

This Pro tutorial provides the steps for setting up a cloneable Meta Box group query inside a CPT query in Bricks. Scenario: CPT: course Meta…
Categories:
Pro
Accordion Grid Query Loop in Bricks

Accordion Grid Query Loop in Bricks

How to set up a accordion in Bricks such that the "titles" are arranged in a grid with the full width content opening below.
Categories: