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 633 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Bricks Query Loop – How to Insert Elements After Every Nth Post

Bricks Query Loop – How to Insert Elements After Every Nth Post

Update: Follow this tutorial instead. This Pro tutorial provides the steps to output element(s) in a Bricks' query loop after every nth post. Use case:…
Categories:
Pro
Upcoming Events with ACF Date Sub field Repeaters grouped by Month Years in Bricks

Upcoming Events with ACF Date Sub field Repeaters grouped by Month Years in Bricks

In the comments section of Upcoming Events Accordion in Bricks Grouped by 'Month Year' a member asked: CPT: eventACF Field: event_dates (Repeater) with event_date sub…
Categories:
Displaying SureCart Featured Products & Products Collections with a Query Loop

Displaying SureCart Featured Products & Products Collections with a Query Loop

We walk through how to use a query loop to display SureCart products, featured products & collections.
Categories:
Pro
Frontend Filtering of Posts by a Date Picker Custom Field in Bricks

Frontend Filtering of Posts by a Date Picker Custom Field in Bricks

How to enable your site visitors to filter the posts (of any post type) by the value of a date picker type custom field.
Pro
Parent Query Loop Object – Traversing Nested Query Loops Up in Bricks

Parent Query Loop Object – Traversing Nested Query Loops Up in Bricks

Bricks enables us to build nested query levels of unlimited levels. Here are a couple of examples: Sometimes, you might want to obtain the parent…
Categories:
Pro
Upcoming Events Grouped by ‘Month Year’ in Bricks

Upcoming Events Grouped by ‘Month Year’ in Bricks

A custom query loop type for showing future events based on a date custom field using three nested query loops.