How to Create an Image Gallery Using the Columns Block

You can use Stackable’s Columns block to create stunning image galleries in your website.

Here are the steps:

1. Add a Columns block

First, add the Columns block from the block library, then select a layout.

2. Add the Image or Image Box block into each column

Click the (+) icon inside each column to add an Image or Image Box block into each column.

Image blocks inside Columns
Image Box blocks inside Columns

After adding the Image blocks, you can upload an image from your computer or choose an image from your Media Library.

Customize the image settings as needed, such as changing the image size, turning on lightbox, or adding hover effects.

3. Duplicate the Columns block

If you want to add more rows of images to your gallery, you can easily duplicate the Columns block.

To do this, select the Columns block then click on the 3-dot button on the block toolbar. Click "Duplicate". This will create an identical row of columns below the existing one.


Use Lightbox in the Image Gallery

You have the option to enable the Lightbox for the images in your gallery.

Toggle on the Lightbox setting for each Image or Inner Column and your photos will open up in a Lightbox gallery. The Lightbox will open up in “gallery mode” and you will have the ability to navigate between the different lightboxes in your gallery.