17th Mar '23
/
8 comments

Conditional Rendering of ACF Repeater Rows Based on True / False Sub Field in Bricks

This Pro tutorial provides the steps to modify a ACF Repeater query loop to only output the rows for which a True / False type of sub field's value is true.

ACF field group:

Fields populated for a Page

Front end before implementing this tutorial:

Front end after implementing this tutorial:

Step 1

Create a field group using ACF Pro having a Repeater-type of field with your desired sub fields.

For the sub field of the type True / False, ensure that "Default Value" is ticked. This will set the default value of this field to true (Yes).

You may want to turn "Stylized UI" setting under the Presentation tab on.

Here's the JSON file of the field group export from our test site. Mirror.

Step 2

Edit your template/Page with Bricks.

Add a Section and inside its Container, a Block.

Enable query loop on the Block.

Set the query type to your ACF Repeater.

Add the Heading/Basic Text elements as needed and set their text to show your text-type sub fields.

Ex.:

Step 3

Next we need to modify the query results of the specified query loop to only include the rows where the active sub field is true.

Add the following in child theme's functions.php (w/o the opening PHP tag) or a code snippets plugin:

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..

Bricks Condition for WishList Member

Bricks Condition for WishList Member

How to render a Bricks element only if the user has access to a specified WishList Member level.
Categories:
Pro
Filtering ACF Relationship Query by Post Meta in Bricks

Filtering ACF Relationship Query by Post Meta in Bricks

How to filter the posts of a post type related to another post type based on the value of a True / False type ACF…
Conditional Rendering for Logged in/out Users by CSS Classes in Bricks

Conditional Rendering for Logged in/out Users by CSS Classes in Bricks

This tutorial shows how Bricks builder's bricks/element/render filter can be used to conditionally output elements having a class of logged-in to logged-in users only and…
Categories:
Pro
Outputting ACF Repeater’s Sub Fields

Outputting ACF Repeater’s Sub Fields

This Pro tutorial provides the code for printing custom HTML after looping through rows of a ACF Repeater (available in ACF Pro) that has a…
Categories:
ACF Relationship: Count of Related Posts

ACF Relationship: Count of Related Posts

Looking to get the number of CPT B posts related to a CPT A post when using a Relationship field with ACF? Here's a custom…
Categories:
Tags:
Pro
How to Insert Element(s) Between Query Loop Posts in Bricks

How to Insert Element(s) Between Query Loop Posts in Bricks

Update on 16 Aug 2023: Follow this tutorial instead. This Pro tutorial shows how we can insert a Div (or any custom HTML) after nth…
Pro
Custom Dynamic Data Tags for ACF Field Label, Prefix and Suffix in Bricks

Custom Dynamic Data Tags for ACF Field Label, Prefix and Suffix in Bricks

Bricks lacks built-in dynamic tags for ACF field labels, prefixes, and suffixes. This tutorial shows how to add them using custom dynamic tags.
Categories: