Galleries are something that you can use to feature several images in one block on your page, such as from a past event.

Getting Started Tips

• Always format your images for the web before uploading them.
• Consider where your users will interact with your gallery as interaction with a gallery can stop further progress down the page.
• Make sure all of your photos have Alt text for each image.

Adding a Gallery

To add a gallery to your content, place your cursor in the spot where you want the new gallery to be and click the template icon:

This will bring up the Insert Templates pop-up window. Choose the option labeled "Gallery" and click the "Select Gallery Options" button. Under Gallery Style, select "Gallery" again and click the "Insert Template" button. It will automatically insert a new Gallery that is ready to be filled with the images of your choice.

Adding Images to Your Gallery

Click on any of the placeholder images to select (the image will have a blue box around it when selected) and click the insert media icon in the WYSIWYG editor. This will open the media browser pop-up window.

Browse to the image on your computer or select an image from your media library.

To add more images to your gallery, right click next to the last gallery image and select the "Edit Gallery" option to bring up the sidebar editor.

The easiest way to add more images is to select "Clone Item" from the Add menu. This will add a new grid item that contains a copy of the image from the first grid item in your gallery. It will also add a placeholder caption and the gallery name (the default name is "group1"). You can then replace the image following the same steps you used to replace the placeholder images. The other options, "Add Item" and "Add Row," will add additional blank grid items to your gallery grid.

To exit out of the sidebar, click the "X" button in the top right.

Note: For the time being, the crop on at least one of the images needs to be set as Gallery Image Large or Gallery Image in order for the gallery to function properly. Other images can use any of the other crop settings including Crop Custom. This will be updated in future iterations. Click on one of the images to select it and then click the "Crop Custom" drop down menu button. The Gallery Image Large option is recommended. If you would like to display a very small thumbnail (100px wide), you can select the "Gallery Image" option.

Add a caption to each image by replacing the default caption text ("Image Caption") with your preferred text. Captions allow text styles like italics and bold, as well as links.

Add a Gallery Background Color

To add or change the background color of a gallery, bring up the sidebar menu by right clicking next to the latest image in your gallery and clicking "Edit Gallery (V2)". From the sidebar menu, select "Color" then "Gallery (V2)" to bring up a color swatch. Click on the color you want to use and it will be applied to your gallery background. 

Modify the Gallery Grid

To modify the layout of the grid that displays your gallery thumbnails, right click an image and then click Edit Gallery (V2). In the sidebar menu, click Modifiers and then Gallery (V2). The options are Flush, Strict, Centered, and Even. 

Move Gallery Items

To move or rearrange gallery items, bring up the sidebar menu by right clicking next to an image in your gallery and clicking "Edit Gallery (V2)" and click "Move Items".

Click on the item you want to move. Hover over the location you want to move the photo to and you will see a preview of the image there with a lavender overlay as shown in the screenshot below. Click to select that location. For keyboard users, press tab to highlight the item you want to move, press the left or right key to shift it over, and press enter again to drop it into place.

Delete Gallery Items

To delete items in a gallery, bring up the sidebar menu by right clicking next to the latest image in your gallery and clicking "Edit Gallery (V2)". Select "Delete Items" then click on the item you want to delete (the item will have a red overlay when you hover over it). For keyboard users, press tab to highlight the item you want to delete and press enter to delete it.

Delete a Gallery

To delete an entire gallery, bring up the sidebar menu by right clicking next to the latest image in your gallery and clicking "Edit Gallery (V2)". From the sidebar menu, select "Delete All" then "Gallery (V2)". Click the "Delete All" button to delete the entire gallery.

Add a Space or New Paragraph Before or After a Gallery

To add a space or new paragraph before or after a gallery, bring up the sidebar menu by right clicking next to the latest image in your gallery and clicking "Edit Gallery (V2)". From the sidebar menu, select "Insert Paragraph" then "Gallery (V2)". Click "Insert Para Before" to insert a space or new paragraph above the gallery. Click "Insert Para After" to insert a space or new paragraph below the gallery.