Sure – you can download the Justified Gallery and the Swipebox jQuery plugins, include them into your theme, setup the script for the Gallery and the Swipebox and generate an ACF field setting for a gallery field. At least you have to build up a page template where you loop through your gallery field and generate the required code for the grid and Swipebox.

You will come across the problem that the Justified Gallery plugin can’t handle the different image size WordPress provides with its ’sizeRangeSuffixes‘ parameter. This is caused in the way WordPress names the images for additional image sizes.

But what, if you can do all this with a few clicks and generate great looking image grids – which individual settings like this!

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

img_25.jpg

img_25.jpg

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This is the image caption

This was my goal when I created the ACF Justified Image Grid Addon. Make it as easy as possible and allow the user to define all possible parameters. In addition, the gallery should load the images effectively as possible.

acf-justified-image-grid-gallery-field

With the ACF Justified Image Grid Addon the images are added with an ACF Gallery field and the plugin loads the smallest images needed for the calculated sizes in the grid. This guarantees the best performance for page loading.

ACF Justified Image Grid Settings

The field settings allow an individual display of the grid

  • Row height for the images
  • Maximum Row height for the images
  • How to handle the last row
  • Make all row the exact same height
  • Show or hide image captions
  • Set the width of the grid border and the image margins
  • Select an individual color for the border and the margins
  • Randomize the images
  • Select your preferred images sizes
  • Use the Swipebox jQuery plugin for large image view

Just add the known ACF field function the_field(„YOUR_FIELD_NAME“) to your page template or use the shortcode [acf field=“YOUR_FIELD_NAME“] to display the image grid.

This version works only with ACF 5.

You can grab the plugin from GitHub

Get ACF-Justified Image Grid

Update 07-20-2015

Today I added 4 functions to display one specific image from the grid or get the image ID, the image url or the src parameters (similar to the WP function wp_get_attachment_image_src) of an image.

Take a look at the Git repro for more infos of all functions.