Home Forums General Issues populate divi gallery module with ACF Reply To: populate divi gallery module with ACF

  • Hi my friend @kreatibu,
    I wil tell you how to accomplish this,is not so difficoult:
    first of all you need an update divi environment with your custom child theme enabled and obviously the latest ACF plugin installed.

    Then you have to create your ACF gallery field(let’s suppose to name it divi_acf_gallery).

    now you have to create your custom divi module that will automatically populate the images from the divi_acf_gallery field.

    Create in your child theme a file named “custom-acf-gallery-module.php” and be sure to add the correct permission/owner/group if you have a local setup/VPS/private server, open it with your preferred editor like notepad++ and past exactly the entire content of the standard gallery module(you can find this in /wp-content/themes/Divi/include/builder/module/Gallery.php

    Now you have to customize the module with your ACF field, this can be done in 3 steps:

    on top of the file you have this code

    class ET_Builder_Module_Gallery extends ET_Builder_Module {

    simply edit as follow to begin your own custom function that we then enqueue to our functions

    function ex_divi_child_theme_setup() {
      if ( class_exists('ET_Builder_Module')) {
        class ET_Builder_Module_Gallery_ACF extends ET_Builder_Module {

    go around line 407 and change the code in this way

    		$attachments_args = array(
    			'include'        => get_field('divi_acf_gallery', false, false),
    			'post_status'    => 'inherit',
    			'post_type'      => 'attachment',
    			'post_mime_type' => 'image',
    			'order'          => 'ASC',
    			'orderby'        => 'post__in',

    you can notice that the query now gets the arrey of images from the acf field

    go at the and of the file and you will find this code
    new ET_Builder_Module_Gallery;
    Delete this line and add this code

    if ( is_singular( array( 'mycpt' ) ) ) {
    	$et_builder_module_gallery_acf = new ET_Builder_Module_Gallery_ACF();
        remove_shortcode( 'et_pb_gallery');
        add_shortcode( 'et_pb_gallery', array($et_builder_module_gallery_acf, '_shortcode_callback') );
    add_action('et_builder_ready', 'ex_divi_child_theme_setup');

    this is one is an important step, you have to choice were this custom module will appears, so in my example the query
    is_singular( array( 'custom-post-type' ) )
    is the most important, in my case tells that if the module is present in a custom post type named “mycpt” then the gallery will be populated by the ACF field, elsewere the function will use the standard divi engine, this is good cause gives to you the ability to clone the standard divi module without hacking it, this is simple a customized copy that will work forever on your selected pages,and will note breack the standard divi gallery pages. you can of course customize the query for a specific page like this
    is_page( array( ‘page-1’, ‘page-2’, ‘page-3’ )

    The latest step is to enqueue this in your functions.php file with a simple line of code that you can comment anytime out if things goes wrong or if you want to disable this feature

    include (get_stylesheet_directory() . '/custom-acf-gallery-module.php');

    have a nice day hope this helps you at least for a starting point