Opens in a new tab
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..

Pro
Day of Week Condition in Bricks

Day of Week Condition in Bricks

Displaying elements conditionally based on the current day of the week.
Categories:
Pro
Checking if the current Page/Post has Children i.e. is a Parent in Bricks

Checking if the current Page/Post has Children i.e. is a Parent in Bricks

Shows how we can check whether the current Page or Post (of any hierarchical post type) is a parent
Categories:
How to create parallax effects using Rellax.js in Bricks

How to create parallax effects using Rellax.js in Bricks

This tutorial provides the JS & PHP codes that can be pasted in order to create smooth parallax effects using the Rellax.js library inside Bricks…
Categories:
[Function] Current Term Has Children

[Function] Current Term Has Children

Updated on 20 Jul 2024 A user asks: I'm working on an archive template for WooCommerce products. I'm trying to hide a section if there…
Pro
ACF Date Field Value Custom Format in Bricks

ACF Date Field Value Custom Format in Bricks

In the Bricks forum, a user asks: Hi there, I am setting up an events calendar using bricks. In some circumstances I would like to…
Categories:
Tags:
Pro
Related Posts using ACF Post Object in Bricks

Related Posts using ACF Post Object in Bricks

Modifying the query loop to limit the posts to only related posts via an ACF Post Object custom field.
Categories:
Tags: