Envira Gallery Documentation

Documentation, Reference Materials and Tutorials for Envira Gallery

How to Create a Justified Image Grid Gallery

Share This Post!

Envira makes it easy to display your images in a justified image grid, follow our documentation to learn how to create your own justified image gallery.

  1. Requirements
  2. Configuration
  3. FAQs

Requirements


Configuration

Step 1 – Create or Edit a Gallery

If you haven’t already, go ahead and create a new gallery or select an existing gallery to edit.

Step 2 – Configure Justified Layout

Now that you’re editing your gallery, select the Config tab to begin configuring your justified gallery.

Select the Config tab to begin configuring your justified image gallery with Envira.

Next, within the Config tab select Automatic from the Number of Gallery Columns dropdown field.

Choose Automatic from the Layout options to display your gallery in a justified image grid.

You’ll also find the following specific options within the Config tab when you choose Automatic layout:

  • Automatic Layout: Row Height — Determines how high (in pixels) each row will be. 150px is default.
  • Automatic Layout: Margins — Sets the space between the images (defaults to 1) for the ‘gutters’ of each column.
  • Automatic Layout: Last Row — Sets how the last row is displayed. Available options: Left (image will align left), Fill (image will fill the space making the image fullwidth of the gallery) or Hide (the last image will not display).
  • Automatic Layout: Gallery Theme — Sets the theme for the gallery display. ‘Normal’ is available by default, use the Themes Addon for more options. Available options: Normal, Blur, Desaturate, Threshold and Vintage.
  • Display Gallery Description? — Choose to display a description above or below this gallery’s images. Available Options: Do not display, Display above gallery, Display below gallery.
  • Enable CSS Animations? — Enables CSS animations when loading the main gallery images.
  • Image Opacity — The opacity to display images at when loading the main gallery images using CSS animations (between 1 and 100%).
  • Enable Deeplinking — If you have installed and activated the Deeplinking Addon, you can choose to enable or disable deeplinking capabilities for gallery lightbox images.
  • Sorting — Choose to sort the images in a different order than displayed on the Images tab. Available options: No Sorting, Random, Publish Date, Filename, Title, Caption, Alt tag and URL.

Step 3 – Publish and View Justified Gallery

Save the changes to your gallery and either embed it on a post/page or view it from the Standalone URL to see your justified gallery.

Envira’s Justified Layout will automatically fit the best number of images in each row of the gallery and create a gallery that resembles the following:

A justified image grid gallery using Envira Gallery.

That’s it, you’ve successfully created a justified grid gallery!


FAQs

Q: Can I automatically apply photo effect filters to the images using justified layout?

A: Yes! If you’re using the Themes Addon (available with a Silver or greater license) you can apply special photo effects using the Justified Layout option following our guide: How to Apply Photo Effects to Galleries and Albums.


Q: Can I use the justified grid layout with Albums?

A: Yes! If you’re using the Albums Addon you can also configure your albums to display in a justified grid following the steps above when editing the album.

Share This Post!