26th Sep '23
/
1 comment

Bricks Slider Images From ACF Flexible Content Sub Field

Consider the following field group associated with Pages when using ACF Pro:

"Page Fields" field group|_"Page Content" Flexible Content field|__"Layout 1" layout|___"Title" Text field|___"Layout 1 Gallery" Gallery (sub) field

The requirement is to feed all the images set for the Gallery field for all the Layout 1 rows to a Bricks Slider element. This Pro tutorial shows how based on this method/idea.

We shall first write a custom function that takes in the field name, layout name and sub field name as its arguments and returns an array of IDs of all the images of the specified gallery-type sub field across multiple rows of the given layout in the provided Flexible Content field.

We shall then call the above function inside a function hooked to bricks/posts/query_vars filter to programmatically set the source of the "posts".

Step 1

Create your ACF field group (json export).

Step 2

Edit your Pages and populate the field.

Ex.:

Step 3

Edit your Bricks Page/template and add a Slider (Nestable) element inside a Section's Container.

Delete Slides 2 and 3.

Select Slide 1 and enable query loop.

Post type: Media

Style → BACKGROUND:

{post_id}

Step 4

Add the following in child theme's functions.php 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
ACF Font Awesome Field in Bricks

ACF Font Awesome Field in Bricks

We walk through using the Advanced Custom Fields: Font Awesome Field plugin for showing Font Awesome icons.
Categories:
Tags:
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:
Pro
Merging ACF Gallery Images with Featured Image in Bricks

Merging ACF Gallery Images with Featured Image in Bricks

Updated on 12 Mar 2025 In the Bricks Facebook group a user asks: Merging images from different fields into a single gallery Hi, I have…
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
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:
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:
Pro
Sorting ACF Relationship Posts by Date Meta in Bricks

Sorting ACF Relationship Posts by Date Meta in Bricks

Consider the following setup: CPT: Events ACF Fields:Event Date Information (Group)|__Event Date (Date Picker)Pick Sub Events (Relationship) An Event can have 1 or more related…