All Collections
Website editor
Elements
How to add an image gallery
How to add an image gallery

Learn how to add an image gallery to your website

Updated over a week ago

There are two ways to add an image gallery to your website:

Image gallery element

Within the editor, expand the Add elements panel on the left. Select the gallery element and drag and drop it anywhere on your page:

Click on the element to see more options; you can manage the gallery, open its settings, duplicate or delete the element:

Click Manage gallery to add or delete images. You can also drag and drop the images to the desired order:

Open the gallery settings to change the layout, the number of images per row, the gap between images, and what happens when the user clicks on the image:

NOTES:

  • The grid layout displays images in strict squares

  • The masonry layout displays images in their original proportions


Third-party image gallery widget

If you want something more custom, feel free to use third-party tools. Elfsight is one of many platforms that offer various embeddable widgets, including the Photo Gallery widget

On Elfsight.com, you will find a variety of image gallery templates. Once you select a template, customize it to your liking:

Once you're finished creating your widget, save it:

Then, click Add to website and copy the integration code:

Paste the code into your website using the embed code element and resize it if necessary. Once you're done, update your website, and voilà!

NOTE: You may be asked to select an Elfsight plan; feel free to choose the free one

Did this answer your question?