The Gallery block allows you to quickly add multiple photos that are automatically arranged in an attractive way.
Here’s what it looks like when it’s added to the Block Editor.
To add a gallery block you click on the + icon at the right of any empty block or at the top left of the editor then search for gallery and click on the gallery block icon.
More detailed instructions for adding blocks can be found here.
Once you have added the gallery block, you click on Upload or Media Library to add your images.
Upload lets you upload images from your device while Media Library is used to select images you’ve already uploaded to your site’s media library.
Once your images have uploaded you click on an image to add the caption and can use the Move arrows to move the image forward or backwards within the gallery.
Images are added to the gallery in the order you selected them. Click on any gallery image and use the left/right arrows to reorder the images, the Edit icon to replace an image or the x icon to remove an image.
You can also add a gallery caption.
You reveal the block’s toolbar by selecting the block. The gallery block toolbar has options to change block type and alignment.
The change block type or style icon is used to transform the block to an image block or a group block.
The alignment of the gallery block is changed by clicking on the change alignment icon and selecting the preferred alignment.
Choosing right or left will allow you to place another block alongside the file block. Choosing center will return the block to its default, taking up the full width of the post or page.
- Align left: used to align gallery block left.
- Align Center: used to center align gallery block
- Align Right: used to align right gallery block.
Additional options for the file block are located in the editor sidebar of the block editor. Click on the Settings icon next to the Publish/Update button if you don’t see the editor sidebar.
Under Gallery settings you can select how many columns are displayed. You can select between 1 to 8 columns but can only select as many columns as the number of images you’ve added. The images automatically re-arrange themselves to look good as you change the number of columns.
By default, the images are cropped. Cropping ensures the images in each row are the same size and is helpful if you’ve added images of varying sizes and shapes.
Link controls what the image links to. The options are:
- Attachment Page
- Media File
- None (default)
The advanced tab lets you add a CSS class to your block allowing you to write custom CSS and style the block.