Displaying Albums

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

You can make any page display Albums by assigning it “Albums – masonry & grid” or “Albums – justified grid” page template.

As soon as you assign one of these templates to a page, you’ll notice 3 additional boxes appeared: Content Area Options, Display Photo & Video Albums and  Albums Options. “Content Area Options” and “Display Photo & Video Albums” are the same for both templates (fig. 1):

Fig. 1. Albums. Content Area Options and Display Photo & Video Albums.

Fig. 1. Albums. Content Area Options and Display Photo & Video Albums.

Content Area Options box defines whether content added through Text Editor will be displayed on this page:

  • “no” will hide page content;
  • “first page” option will show content only on the first page of paginated content;
  • “all pages” will display content from Text Editor on every page of paginated content (when user clicks the pagination links).

You can also select where to display a content: before or after albums.

Display Photo & Video Albums box. By default all your Albums will be displayed on this page. But you can specify which Album(s) or Album category(s) will be shown. In tabs inside this box you can select from the following options:

All — all Albums will be shown on this page.
Only — choose Album(s) or Album Category(s) to be shown on this page.
All, except — choose which Album(s) or Album category(s) will be excluded from displaying on this page.

Note that you can select individual albums or whole categories by switching the “arrange by” selector (fig. 2):

Fig. 2. Arrange by selector.

Fig. 2. Arrange by selector.

Albums – masonry & grid

Fig. 3. Albums - masonry & grid.

Fig. 3. Albums – masonry & grid.

Albums Options box determines the appearance of your media albums page:

  • “Layout” setting allows you to switch between masonry and grid layouts (choosing “grid” option will make all images cells in a single row the same height).
  • Gap between images (px).
  • Column minimum width (px). Columns cannot be narrower than this value – layout will collapse to less number of columns.
  • Desired number of columns.
  • Enable 100% width layout – makes your masonry/grid accommodate all page box width.
  • “Show albums descriptions” allows you to specify the way albums descriptions are being displayed: under featured images,  as overlays of featured images on color backgrounds, on dark gradient, in the bottom, background & animated lines.
  • “Make all albums the same width” option will overwrite the “album width” setting from album adding/editing interface and make all albums precisely the same width.
  • Images sizing: set custom image proportion or use original image proportions.
  • Number of albums to display on one page.
  • Loading mode: AJAX; “load more” button; lazy loading / infinite scroll; standard pagination (no AJAX).
  • Loading effect. You can choose from: fade in, move up, scale up, fall perspective, fly, flip, helix, scale.
  • Advanced settings like: which content and meta information to show (titles, excerpts, links, etc), show all pages in paginator, ordering options.

Albums – justified grid

Fig. 4. Albums - justified grid.

Fig. 4. Albums – justified grid.

  • Gap between images (px).
  • Row target height (px). Note that your actual rows will aim to fit this heigh, not necessary will.
  • Enable 100% width layout – makes your grid accommodate all page box width.
  • “Hide last row if there’s not enough images to fill it”. Name speaks for itself. Note that this setting looks best with relatively big number of albums per page.
  • “Show albums descriptions” allows you to specify the way albums descriptions are being displayed: on color backgrounds, on dark gradient, in the bottom, background & animated lines.
  • Content alignment: left or right.
  • Images sizing: set custom image proportion or use original image proportions.
  • Number of albums to display on one page.
  • Loading mode: AJAX; “load more” button; lazy loading / infinite scroll; standard pagination (no AJAX).
  • Loading effect. You can choose from: fade in, move up, scale up, fall perspective, fly, flip, helix, scale.
  • Advanced settings like: which content and meta information to show (titles, excerpts, links, etc), show all pages in paginator, ordering options.

Attention! If you have super-wide screen, set small “Target row height” and number of albums to show, there’s a possibility that images will not fill even one row and therefore nothing will be shown!