Skip to content

How to Create a Gallery in WordPress

Whether you’re a photographer, artist, or someone who just wants to display some images in an interesting fashion, online galleries are the tool of choice. In this guide on how to create a gallery in WordPress, we’ll look at two easy methods:

But first, let’s talk about how they can help you display your images in a more dynamic way on your WordPress site.

create a gallery in WordPress
 

By default, the WordPress Gutenberg editor displays individually uploaded images in a vertical stack, like the images beside this paragraph (or below if you’re viewing this on a mobile device).

This makes sense in a regular blog post, where images have text between them.

In a gallery, however, you want to display images side by side. This allows users to view more images at one time and can help you differentiate your gallery from other areas of your site.

To get this side-by-side display, you have two options. The first is to manually set up columns, then add image blocks to each column. This can be an enormously tedious process if you’re adding a lot of images to the page you’re working on.

The other option is to learn how to create a gallery in WordPress. This is far easier than the first option. It also gives you more ability to customize how your images are displayed.

Let’s take a look at how it works!

Simple Page

Don’t want to install anything new on your website? You’ll be glad to hear that the WordPress Gutenberg editor offers a built-in gallery block. You can add it to any page or post by opening the block menu and searching for Gallery:

How to create a gallery in WordPress: block search for "Gallery"

Click on the block to add it.

How to create a gallery in WordPress: gallery plugin

You can then add images in three ways:

  • Drag-and-drop files from a folder on your computer
  • Upload files from your computer (hold the CTRL key for Windows, or Command key for Mac, to select multiple files at once)
  • Find files in your Media Library (click on as many images as you want)
How to create a gallery in WordPress: Media Library

If you’re pulling images from the Media Library, click Create a new gallery. You’ll then be given the option to add captions to all of your images before you put them into the gallery:

How to create a gallery in WordPress: adding captions in the Media Library

Once you’ve uploaded some images, click on the space between them to see customization options for your gallery in the sidebar. The default gallery block allows you to specify a number of columns. It also lets you set up image cropping, decide where the images will link to, and choose the size of each image. In addition, you can use it to pick a background color for your gallery.

How to create a gallery in WordPress: gallery block with images in place and settings visible in the sidebar

If you opt for more than two columns, and you have an unequal number of images in each row, you’ll notice that the images in the top row are smaller than the image(s) on the bottom. You can’t change this setting, but you can move an image to the bottom of the grid. To do this, simply click on it and press the arrow buttons that appear above it. This allows you to select which image is the largest.

How to create a gallery in WordPress: gallery block with the image editing options open and a red arrow pointing to the move image tool

Next, click on an image within the gallery to set a caption for it.

Gallery with a red block pointing at the "Add caption" area at the bottom of an image

You can also add alt text describing the image in the sidebar. This alt text will make it easier for search engines to identify what your content is about. Alt text also makes your content more accessible to users who are visually impaired, especially those who use screen readers.

How to create a gallery in WordPress: image gallery block options for captions and alt text

You can also add a caption for the entire gallery at the bottom of the block. This can help you explain what ties all of your images together, give credit to the creator, or otherwise give your audience more information about the content of your gallery.

Gallery block selected with a red arrow pointing at the "Write gallery caption" area at the bottom of the block

And voila, you’ve created your very first WordPress gallery! However, there are some limitations to this gallery option. Most notably, you can’t control the spacing between the images. If you want to gain this level of control, you’ll need to create a gallery in WordPress with Otter instead.

Here’s our quick guide on how to do just that:

How to create a gallery in WordPress with Otter

Want to experiment with different layout options for your gallery? Gain access to advanced customization options?

Otter is here to help! This plugin gives you access to several blocks not found in the regular Gutenberg editor. These include things like icons, maps, and countdowns, which you can add to your content. You’ll also get access to new ways of displaying your content, including a slider block and, most notably for our purposes, the Masonry Gallery block.

Otter Blocks banner

Otter is a free plugin that you can add to your WordPress site by going to Plugins > Add New and searching for Otter in the plugin directory. Click Install, then Activate, and you’re ready to go.

Want to learn more about Otter? Check out our full Otter Review.

With Otter installed on your website, you can add a Masonry Gallery to any post or page in just a few steps:

Step one: add gallery

Open the page or post you want to add your gallery to and click the + icon next to any section of the page. Then type Masonry into the search. Click on the block to add it to your page.

Mansory Search

Step two: add images

With the block in place, you’ll have three options for adding your images: drag-and-drop from a folder on your computer, upload from your File Manager, or add from your Media Library. If uploading from your computer, hold CTRL to select multiple files (Command for Mac). If you’re adding images from the Media Library, you can click on as many images as you want, and they’ll all be uploaded.

Media Library

Step three: customize your gallery

The next step in learning how to create a gallery in WordPress is to customize its appearance.

Click on the space between images to open customization options in the sidebar. You’ll notice that many of these options are the same as before: number of columns, image cropping and linking, and image size. However, there are also two new options:

  • Masonry. This allows you to control the size of the margins between photos, controlling the overall appearance of your gallery. Keep in mind, margin changes aren’t reflected on the backend; you must preview or publish the post to see them on the frontend.
  • Block tools. You can use these tools to add animations to your gallery. You can also add custom CSS to completely customize its appearance, and transform it into a sticky so that it follows users as they scroll down your page. In addition, you’re able to set up Visibility Conditions to control who sees your gallery and when they see it.
How to create a gallery in WordPress: Otter options

Step four: add captions and alt text

If you haven’t already added captions, this is the stage where you’ll want to add them. You can add captions to individual images by clicking on them and writing into the space provided.

Gallery block with the middle image selected and an arrow pointing at the "Add caption" area at the bottom of the image

Clicking on an image will also open the alt text customization tool in the sidebar. Again, you want to make sure that your alt text describes your images so that both visually impaired users and search engines can better understand your content. For best effect, you want to look for a natural way to include the focus keyword for the page you’re using into some or all of your image alt text.

How to create a gallery in WordPress: Gallery block selected with a red arrow pointing at the "Write gallery caption" area at the bottom of the block

You’ll also find an area where you can add a caption for the gallery as a whole at the bottom of the block.

Step five: publish

Now you’re ready to share your gallery with the world! Make sure you’re happy with the other content on your page, then click the Publish button in the top right corner of the WordPress editor.

There are many reasons to create a WordPress gallery. You can use it to showcase your photography or design work. You can also share collections of images from events you’ve hosted or attended, or add images of your team at work to your “About” page, and much more.

These powerful image display tools are also quite easy to set up. You can create a basic gallery in just a few clicks with the regular WordPress editor, or add Otter Blocks to your website to gain access to advanced customization options. Either way, you’ll end up with a beautiful display of your images to share with the world.

Want to learn more about how to use WordPress? Check out our ultimate guide to building a WordPress site!

Don’t forget to join our crash course on speeding up your WordPress site. Learn more below:

 
Yay! 🎉 You made it to the end of the article!
Dianna Gunn
Share:

0 Comments
Most Voted
Newest Oldest
Inline Feedbacks
View all comments

Or start the conversation in our Facebook group for WordPress professionals. Find answers, share tips, and get help from other WordPress experts. Join now (it’s free)!