19th Jul '24
/
0 comments

Post-specific HappyFiles Galleries using a ACF Select Field in Bricks

Post-specific HappyFiles Galleries using a ACF Select Field in Bricks

This Pro tutorial provides the steps to use ACF to select one or more HappyFiles' folders and output the images from the selected folder(s) using HappyFiles shortcode or Bricks' Image Gallery element or img elements in a query loop.

This is the equivalent of Post-specific HappyFiles Galleries using a Meta Box Select Field in Bricks tutorial but for ACF instead of Meta Box.

Step 1

Install and activate HappyFiles.

Go to Media → Library.

Create folders and categorize images by moving them into the folders.

Step 2

Install and activate ACF.

Go to ACF → Field Groups.

Create a new field group for your post type having a Select-type field.

Leave the Choices empty. We shall populate it programmatically in the next step.

If you would like to be able to select multiple folders, enable the "Select Multiple" option.

If you would like - Select - to appear as the 1st option for this field in the post editor screens, enable Allow Null in the Validation tab.

Step 3

Let's define a custom function to populate all HappyFiles folder names as options of above Select field.

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 632 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

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

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…
Categories:
Pro
ACF Options Fields in Bricks

ACF Options Fields in Bricks

This Pro tutorial walks you through outputting the values of custom fields attached to an ACF Pro's Options page in Bricks builder. We shall register…
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
Frontend Editing with ACF in Bricks

Frontend Editing with ACF in Bricks

This Pro tutorial provides the steps to show a form on single posts on the front end for admins and the post author using which…
Categories:
Pro
ACF Image Data in Bricks

ACF Image Data in Bricks

Displaying Alt text, Caption, Title and URL of an ACF image field for posts in a query loop.
Categories:
Tags:
Pro
Google Maps JavaScript API in Bricks

Google Maps JavaScript API in Bricks

This Pro tutorial provides the steps to show post-specific maps with custom marker content in Bricks using Google's Maps JavaScript API and Advanced Custom Fields.…
Categories:
Pro
HappyFiles Folder Images via Meta Box Taxonomy Field in Bricks Image Gallery

HappyFiles Folder Images via Meta Box Taxonomy Field in Bricks Image Gallery

How to set the source of Bricks’ Image Gallery element on a post to images in the selected HappyFiles Folder(s) via a Meta Box Taxonomy…