Masonry Images Shortcode

Masonry images

The masonry images shortcode produces masonry style layouts of images with varying heights. 

Demo: Masonry Images Shortcode

Tip: You will find a list of shortcodes by clicking "More information about text formats" at the bottom right under the WYSIWYG editor.

1

Insert Masonry Images Shortcode

  1. Place your cursor in the Body content areas where you want the masonry images gallery to appear.
  2. Enter the shortcode:

[masonry-images columns=2]

images go here

[/masonry-images]

Add images in between the beginning and ending masonry shortcode tags

2

Set the Number of Columns

  1. The opening tag sets the number of columns. You may have 2 to 5 columns.

Sample shortcode with four columns:

[masonry-images columns=4]

images go here

[/masonry-images]

Masonry shortcode with four columns

3

Image Layout Tip

The masonry images shortcode adds images one after another, first in the horizontal direction, then vertically.