This Pro tutorial provides the steps to show images from two Gallery-type of ACF or Image Advanced-type of Meta Box fields in a staggered grid layout.
We shall write a custom function that builds an array with IDs of images like this:
- first image from the full width images
- first two images from the half width images
- second image from the full width images
- third and fourth images from the half width images
and so on...
This function will then be set as the source of images for the Bricks' Image Gallery element.
After implementing the tutorial:
Step 1
Create a field group for your post type (page in this example) having:
If using ACF
two 'Gallery' fields
Set the Return Format to Image ID for both fields.
If using Meta Box
two 'Image Advanced' fields
Step 2
Edit your posts (Pages in this example) and populate the fields.
ACF:
Meta Box:
Step 3
Add the following in child theme's functions.php (w/o the opening PHP tag) or a code snippets plugin:
If using ACF:
