The Gallery block helps you present several images on your site – whether it’s a portfolio or photos from an event, shown in a clean, clear way. You can add stock photos or your own images.
There are two types of Gallery block that display your images differently: a layout that lets you add a descriptive title and text to the gallery, or a full-width layout spanning the whole page with images in different sizes.
Adding the block
- Choose where you want the gallery and click Add a block (+).
- In the Blocks library, go to the Gallery section in the left-hand menu to see the ready-made layouts.
- Click the layout you like to add it to your page.
Customising the block settings
Click the block, then the Block settings icon. The menu has two tabs: Layout and Appearance.
In the Layout tab you can switch layouts and choose which elements appear – remove the blue tick next to an element to hide it.
In the Appearance tab you can change:
- Block style: the block’s colour scheme.
- Block spacing: the space above and below the block.
- Content layout: the number of items per row.
- Media settings: add a black-and-white filter to the images in the block.
Click Save when done.
Replacing demo images
You can replace the demo images with your own business images and then customise them – most of this is done from the image’s control panel. You can upload images from your computer, or add free stock photos from the built-in library.
- Click the image you want to replace to activate its control panel.
- Click the Upload image icon to see the upload options.
- Choose Upload a file to pick from your computer, or Browse free stock photos to open the free image library.
- Confirm by clicking Open (for uploads) or Submit (for stock photos).
Cropping a gallery image
If an image doesn’t fit the frame perfectly, crop it directly in Sitebuilder using the Crop icon in the image control panel. This also lets you adjust the image’s position and focal point within its container.
Media settings
Besides cropping and replacing, the Media settings menu lets you:
- Add an image title, alt text and description
- Enable a click action for the image
- Remove images from the gallery
Gallery slider
To create a slideshow or image carousel, use the Gallery block’s Slider layout.
Removing images from the gallery
You can remove images in two ways: via Media settings or Gallery settings.
Via Media settings: click the image, click the Media settings icon, scroll to the bottom and click Delete image. The image is removed immediately – undo with Ctrl+Z (Cmd+Z on Mac) or the Undo button in the top bar.
Via Gallery settings (for removing several at once):
- Click an image in the Gallery block, then the Gallery settings icon.
- Click Select to enable image selection.
- Click the items you want to remove – they’re marked with blue ticks.
- Click the bin icon.
- Click Submit to save.
To select every image in the gallery at once, click the checkmarks icon, then delete them all with the bin button. You can then upload your own images in bulk from the same window by clicking the (+) button – either from your computer or the free image library.
Resizing images in the Gallery block
Click an image to activate its resize handle, then drag it up or down – the layout adjusts automatically. Note: only image height can be changed; width is locked to keep the design responsive.
Image settings shortcuts
Right-clicking an image gives you shortcuts to many of these functions, including changing the alt title, setting a click action, and copying, cutting or pasting the block. Each shortcut opens a pop-up with the relevant action.