ACF Photo Gallery Field

Important Notice for New Users of ACF Photo Gallery Field

If you are installing the ACF Photo Gallery Field for the first time on your WordPress website, we’d like to inform you that this plugin will no longer be maintained as of October 2024. As an alternative, we have launched a new and improved plugin called ACF Galerie 4.

We encourage you to check out ACF Galerie 4 for enhanced features and ongoing support. ACF Galerie 4 includes a built-in migration tool that seamlessly transfers data from ACF Photo Gallery Field or ACF Gallery Pro to ACF Galerie 4. Learn more.

Thanks

A lightweight extension of Advanced Custom Field (ACF) that adds Photo Gallery field to any post/pages on your WordPress website.

• Visually create your Fields
• Add multiple photos and you can also modify title, caption and link to anything
• Assign your fields to multiple edit pages (via custom location rules)
• Easily load data through a simple and friendly API
• Uses the native WordPress custom post type for ease of use and fast processing
• Uses the native WordPress metadata for ease of use and fast processing
• Supports WordPress classic and Gutenberg editor
• RESTFul API

Donation

Navneil Naicker is the sole developer working on this free WordPress Plugin in his leisure time. He would like to integrate it with premium plugins like Elementor Pro and Advanced Custom Fields Pro. Please donate to support Navneil in continuing further development of this plugin. Click on the link “https://www.buymeacoffee.com/navzme” to donate.

Usage

acf_photo_gallery is a helper function that takes in ACF_FIELD_NAME and POST_ID will query the database and compile the images for you. The output of this function will be an array.

acf_photo_gallery(ACF_FIELD_NAME, POST_ID);

Example

The following example is using Twitter Bootstrap framework to layout. You can use any framework of your choice.

<?php
    //Get the images ids from the post_metadata
    $images = acf_photo_gallery('vacation_photos', $post->ID);
    //Check if return array has anything in it
    if( count($images) ):
        //Cool, we got some data so now let's loop over it
        foreach($images as $image):
            $id = $image['id']; // The attachment id of the media
            $title = $image['title']; //The title
            $caption= $image['caption']; //The caption
            $full_image_url= $image['full_image_url']; //Full size image url
            $full_image_url = acf_photo_gallery_resize_image($full_image_url, 262, 160); //Resized size to 262px width by 160px height image url
            $thumbnail_image_url= $image['thumbnail_image_url']; //Get the thumbnail size image url 150px by 150px
            $url= $image['url']; //Goto any link when clicked
            $target= $image['target']; //Open normal or new tab
            $alt = get_field('photo_gallery_alt', $id); //Get the alt which is a extra field (See below how to add extra fields)
            $class = get_field('photo_gallery_class', $id); //Get the class which is a extra field (See below how to add extra fields)
?>
<div class="col-xs-6 col-md-3">
    <div class="thumbnail">
        <?php if( !empty($url) ){ ?><a href="<?php echo $url; ?>" <?php echo ($target == 'true' )? 'target="_blank"': ''; ?>><?php } ?>
            <img src="<?php echo $full_image_url; ?>" alt="<?php echo $title; ?>" title="<?php echo $title; ?>">
        <?php if( !empty($url) ){ ?></a><?php } ?>
    </div>
</div>
<?php endforeach; endif; ?>

Add Extra Fields

To add extra fields add the following to your themes functions.php file.

Read the full description on the official page →