Opens in a new tab
4th Apr '24
/
0 comments

Post-specific ACF Repeater Galleries as Sliders in Bricks

Consider this field group for Pages:

ACF Pro Repeater field being populated for a specific Page:

This Pro tutorial for Bricks users provides the steps to output post-specific ACF Repeater field rows with the images of the Gallery-type sub field be the source of a slider for each row. In this example, that would be showing any/all the property-specific sliders for the current Page.

We shall use nested query loops, with ACF Repeater as the outer query loop and the inner being an Attachment query loop on the nestable slider's slide. The images' source will be the outer loop's current looping object's property_gallery field.

Step 1

Create your ACF field group. If you'd like to follow along, download this JSON and import it at ACF → Tools.

Step 2

Edit a Page (or any post of your post type) or two and populate the Repeater field.

Step 3

Edit a specific Page or the Bricks template that applies to all posts of your post type - in this case, all Pages.

Copy the JSON below and paste to get this Section:

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 634 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
ACF Flexible Content Field – Layout Labels and Sub Field Labels

ACF Flexible Content Field – Layout Labels and Sub Field Labels

How to output the text of layout labels and/or sub field labels using the Flexible Content field of ACF Pro.
Categories:
Pro
ACF Repeater sub field value dynamic data condition in Bricks

ACF Repeater sub field value dynamic data condition in Bricks

This Pro tutorial provides the steps to output an element on single posts (can be of any post type) only if a specified ACF (Pro)…
Pro
Posts Grouped by Post Dates in Bricks

Posts Grouped by Post Dates in Bricks

Setting up query loops for “Post Dates” with an the inner loop displaying all posts published on that day.
Categories:
Pro
Slow Zoom Effect for Slides in Bricks

Slow Zoom Effect for Slides in Bricks

This Pro tutorial provides the steps to set up a slow zoom effect for slides of nestable slider element in Bricks. Step 1 Add a…
Categories:
Tags:
Pro
Nav Menus Custom Query Types in Bricks

Nav Menus Custom Query Types in Bricks

Updated on 21 Aug 2024 This Pro tutorial shows how custom query types for each navigation menu can be generated in Bricks. This enables us…
How to add a custom SwiperJS slider in Bricks

How to add a custom SwiperJS slider in Bricks

In this tutorial, we'll show you how to integrate a custom slider in Bricks using the SwiperJS library and how to add custom parameters using…
Categories:
Tags:
Pro
Meta Box/ACF Images Staggered Grid Gallery in Bricks

Meta Box/ACF Images Staggered Grid Gallery in Bricks

Showing images from two Gallery-type of ACF or Image Advanced-type of Meta Box fields in a staggered grid layout.