Image Gallery For Free ACF Plugin
Written by the Divi Engine Documentation Team
Introduction
Follow these steps to set up an image gallery with the free version of ACF.
Step 1: Add Group Type Gallery Custom Field
Make your way to the Field Group in ACF associated with your desired Post Type. Add a Group Type Gallery Custom Field.
Step 2: Add A Gallery Of Images
Add as many Sub Fields as you desire with Type Image. Make sure that you go to your posts and add images for each post.
Step 3: Create A Single Post Template
Make your way to the Single Post Template in the Theme Builder where you would like to display an Image Gallery.
Step 4: Add & Customize The Gallery Slider Module
After adding the Gallery Slider/Module you will need to customize it by defining the Gallery Layout, ACF Gallery Type, ACF Group Name as well as other options. For more information on this module please visit the Modules section in our documentation to your left.
Step 5: Build A Unique Grid Layout
From Machine 3.6 there has been the ability to build a unique grid of different sizes of images. To use this feature add images to your gallery as shown above. Next, open up the Grid Settings section of the module and there you will see a black box that says Grid Custom Code.
Select Grid Gallery Layout
Grid Settings
Grid SettingsIn Grid Settings insert code (CSS) describing the arrangement of your images using THIS website here: grid.layoutit.com. For example, the image grid below is made using the following "mod" code. Please know that it is important to use "mod-" as the start of each of the grid elements.
More Support?
Please email us at [email protected] if you are unable to get Divi Machine working.