6th Sep '24
/
0 comments

ACF Relationship Select Filter in Bricks

In the BricksLabs Facebook group, a user asks:

I'm learning about ACF relationships and attempting to output a list of posts on any given page, and use the filter - select element in Bricks to refine the output by an ACF relationship field.

Can you recommend BL Tutorials that might help here?

---------------------------------------------------

CPT Downloads: Relationship with one or more Events.

CPT Events: Relationship with one or more Downloads.

Query loop: output all downloads and filter by event.

The built-in Bricks' 'Filter - Select' element does not seem to work with a Relationship-type of field as of Bricks 1.10.3.

We can set up a custom select menu populated with the posts of a CPT and write some custom JavaScript for filtering the posts of another CPT.

This Pro tutorial shows how a custom select menu can be populated with the posts of a CPT that filter the posts of another CPT using JavaScript, where both CPT items are connected via an ACF Relationship field in Bricks.

Consider this example:

CPT 1: EventsRelationship field: Related Downloads

CPT 2: DownloadsRelationship field: Related Events

Events:

Downloads:

Event 1: Download 1, Download 3Event 2: -Event 3: Download 2Event 4: Download 2, Download 3

After implementing the tutorial, a list of downloads that can be filtered by their related events on the downloads CPT archive page (could be a static Page as well):

While this article's custom filter build process is specific to ACF Relationship, the overall process to build a select menu dropdown to filter one set of items with another set of related items is the same.

Step 1

Install and activate ACF.

Create your two custom post types.

Create a field group for each.

Event Fields:

Download Fields:

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 632 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Bricks Dynamic Data Tag for Text-type Custom Field Value with Word Limit

Bricks Dynamic Data Tag for Text-type Custom Field Value with Word Limit

How to register a new dynamic tag for setting excerpt word limits and outputting an ellipsis (...) at the end.
Categories:
Pro
Querying Posts by ACF Date Sub Field in Bricks

Querying Posts by ACF Date Sub Field in Bricks

Updated on 17 Nov 2023. This Pro tutorial shows how we can set post__in query parameter of a query loop in Bricks to an array…
Categories:
Tags:
Pro
Filtering Query Loop Posts by a Non-empty Custom Field in Bricks

Filtering Query Loop Posts by a Non-empty Custom Field in Bricks

This Pro tutorial shows how we can prefilter the results of a query output by a Bricks query loop to only those for which the…
Categories:
Tags: