Displaying Gallery

[Please learn what’s the difference between “Albums” and “Galleries” page templates first]

In order to display Photos page, you can use our super configurable WPBakery photos shortcodes (fig. 1):

Fig. 1. Photos shortcodes.

Fig. 1. Photos shortcodes.

Photos Masonry and Grid

Fig. 2.1. Photos Masonry & Grid.

Fig. 2.1. Photos Masonry & Grid.

First “General” box in shortcode settings offers to select which albums to display (fig. 2.2).

Fig. 2.2. General photos settings.

Fig. 2.2. General photos settings.

You can select albums basing on their category or display all albums. Other settings from this tab allow to configure posts feed:

  • Masonry or Grid mode;
  • loading effect;
  • image sizing, border radius, shadow, animation, hover;
  • columns settings, where you can specify number of columns depending on device and browser width;
  • responsiveness (decide when to switch to a single-column layout).

It is possible to enable different modes of pagination and adjust the number of photos to display in “Pagination” tab. You can also configure ordering settings here: descending/ascending order, name/date ordering and look of pagination buttons.

In “Hover Icon” tab, you can:

  • decide whether to display an icon on image hover;
  • select a specific icon;
  • configure icon size, color, background and border.

Photos Justified Grid

Fig. 3.1. Photos Justified Grid shortcode.

Fig. 3.1. Photos Justified Grid shortcode.

This shortcode has less settings than the “Masonry & Grid”. In “General” tab you can:

  • select categories to display;
  • specify how many albums should be displayed;
  • adjust ordering settings.

Appearance” tab (fig. 3.2) allows to specify:

Fig. 3.2. Appearance settings.

Fig. 3.2. Appearance settings.

  • loading animation effect;
  • row target height and gaps between images;
  • featured images proportions;
  • hide last row if there’s not enough images to fill it (in such a situation, albums get stretched in this row. If such an effect does not suit you, this row can be hidden).

You can also decide whether to display photo titles and descriptions here.

Photos Carousel

Fig. 4.1. Photos Carousel.

Fig. 4.1. Photos Carousel.

Photos Carousel has almost the same settings as Photos Masonry & Grid, except options for scroll: whether to scroll one slide at time or all visible slides. Plus, settings for arrows and bullets (fig. 4.2):

  • disable/enable;
  • select icon, its color, background and position.
Fig. 4.2. Bullets settings.

Fig. 4.2. Bullets settings.

Page Templates

In addition to WPBakery Photos elements, you can also use “Gallery – masonry & grid” or “Gallery – justified grid” templates (fig. 5). But please consider, they have less settings than the shortcodes described above.

Fig. 5. Gallery page template.

Fig. 5. Gallery page template.