WordPress puts every photo you add on a line of its own. Add a few, and the before-and-after or the pair of product shots you planned turns into a long scroll.
Putting WordPress images side by side doesn’t take any code. There are four easy ways to line them up in a row, from a 30-second fix built into WordPress to a full gallery.
I tested each one on a fresh WordPress site, on a desktop screen and on a phone. You’ll see what each method looks like and which one fits your photos.
In This Article:
How to Put Images Side by Side With the WordPress Gallery Block
The Gallery block is built into WordPress, so there’s nothing to install. It’s the quickest way to put a few photos in one neat row.
Step 1: Add a Gallery Block and Your Photos
Open your post or page in the editor and click the + button. Search for “Gallery,” add the block, and choose two or more photos from your Media Library or upload new ones.
Step 2: Set the Number of Columns
With the Gallery block selected, find Columns in the Settings panel on the right. It shows three per row by default, so for a single row, set Columns to the number of photos you’re showing.
Leave Crop images to fit on, as it is by default, so every tile comes out the same size.
Here are those three photos on the live page:
One thing I noticed while testing: add a fifth photo to a three-column gallery and the short last row stretches to fill the width. Those two photos come out wider than the rest.
If a photo already has a caption in your Media Library, it shows on top of the photo. You can clear it in the block.
How to Place Images Next to Each Other With the Columns Block
The Columns block splits part of your page into two or three side-by-side areas. Each photo gets its own space, with its caption underneath instead of on top.
Add a Columns block from the + button and pick 50 / 50 for two photos, or 33 / 33 / 33 for three. Then add an Image block inside each column.
For a caption, click the photo and use Add caption in its toolbar. The Columns block settings also have a Stack on mobile toggle, which is on by default.
On the live page, each caption sits under its photo:
Each photo keeps its own shape in a Columns block, so two portraits with different proportions end at different heights and their captions won’t line up.
How to Put an Image Next to Text in WordPress
The same block handles a photo with text beside it. Choose the 33 / 66 layout, add an Image block to the narrow column, and type your paragraph in the wide one.
It suits recipes or product notes, where the photo and its description belong together.
How to Line Up Images by Aligning Them Left
Add each photo as its own Image block, then click the photo and open Align in its toolbar.
Choose Align left on each photo. They line up from the left, one next to the other, and the text that follows wraps into the space beside them.
On the live page, the paragraph flows around both photos:
That wrap suits a story told around a couple of photos. For a row of their own, the Gallery or Columns block works better.
Where aligned photos sit depends on your theme, and some themes push them out to the page edge. Our guide to image alignment covers the other options.
How to Show Images Side by Side With Envira Gallery (Free)
The built-in blocks are perfect for two or three photos. When you’re showing a bigger set, or adding photos over time, a gallery plugin keeps every row tidy for you.
Envira Gallery is a WordPress gallery plugin, and its free version, Envira Gallery Lite, covers everything in this section.
Step 1: Install Envira Gallery and Add Your Photos
In your dashboard, go to Plugins » Add New Plugin, search for “Envira Gallery,” and click Install Now, then Activate. Next, go to Envira Gallery » Add New and give your gallery a name.
Click Select Files from Your Computer to upload photos, or Select Files from Other Sources to pick ones from your Media Library. They appear under Currently in your Gallery, where you can drag them into order.
With your photos in, the next step is the row itself.
Step 2: Choose How Many Photos Go in Each Row
Open the Config tab and find Number of Gallery Columns. It starts on Automatic, and you can switch it to anything from one to six columns.
Automatic fills each row with photos of the same height, so mixed portrait and landscape shots still line up. Only full rows reach both edges, though, so a short last row or a one-row gallery sits to the left.
For two or three photos side by side, I’d pick a fixed number of columns instead. Choose Two Columns or Three Columns, and Column Gutter Width appears so you can set the space between photos.
Our tutorial on spacing out gallery photos goes into more detail. For tiles of the same size, switch on Crop Images? in the same tab. It’s off by default, so each photo keeps its own shape.
Step 3: Add the Gallery to Your Post With the Envira Gallery Block
Click Publish to save the gallery. Then open your post, add the Envira Gallery block from the + button, and pick your gallery under Search for a Gallery.
In the free version, the block’s Select Layout setting lists the same column choices, so you can change the number of columns without leaving your post.
With more photos on Automatic, every full row runs edge to edge at the same height:
Clicking any photo opens it full screen in a lightbox, which is on by default in every new gallery.
You can add the same gallery to any other page, and one edit updates it everywhere. For small previews that open larger photos, see our tutorial on thumbnail galleries.
Automatic is the one layout in the free plugin. Other looks, like a masonry image gallery, come with a paid plan.
Keep Every Row of Photos Looking Neat
Adding to your photos over time? Envira Gallery keeps them lined up in neat rows, opens each one full screen with a click, and puts the same gallery on any page you like.
How to Keep Side-by-Side Images Looking Good on Phones
A row that looks perfect on your laptop can look very different on a phone. Each method handles small screens its own way, and these are the results from my tests:
- Gallery block: at most two photos per row. A two-photo gallery stays side by side, while three or four columns break into pairs.
- Columns block: the photos stack, because Stack on mobile is on by default. Switch it off to keep them side by side.
- Align left: the photos stack.
- Envira Gallery on Automatic: the rows rearrange to fit. A row of five became a row of two and a row of three.
Here are the Gallery block and the Columns block side by side on a phone:
Stacking isn’t a bad thing, since one large photo is often easier to see on a small screen than two tiny ones. Our guide to responsive gallery grids has more on galleries for phones.
Expert Tip
If two photos must stay together on a phone, like a before-and-after, use a two-photo Gallery block. Then open the page on your own phone before you share it, so you see exactly what visitors will see.
Which Method Should You Use to Put WordPress Images Side by Side?
All four methods are free, so the right one comes down to your photos:
| Method | Best for | Watch out for | On a phone |
|---|---|---|---|
| Gallery block | A quick row of two to four photos | A short last row stretches wider | Two per row at most |
| Columns block | Photos with their own captions, or a photo next to text | Photos of different shapes end at different heights | Stacks unless you switch off Stack on mobile |
| Align left | Photos with text wrapping beside them | Position changes from theme to theme | Stacks |
| Envira Gallery (free) | Bigger sets you’ll add to, shown on more than one page | On Automatic, a short row sits to the left | Rows rearrange to fit |
If you want two photos side by side in a minute: use the Gallery block with Columns set to 2.
If each photo needs its own caption: use the Columns block.
If your text should flow around the photos: use Align left on each Image block.
If your photo collection keeps growing: use Envira Gallery, so new photos drop into the same rows.
FAQs About Putting WordPress Images Side by Side
How do I put two pictures side by side in WordPress?
Add a Gallery block, choose your two pictures, and set Columns to 2. If each picture needs its own caption, use a two-column Columns block instead.
How do I put an image next to text in WordPress?
Use a Columns block with the image in one column and your text in the other. For text that wraps around the image, set the Image block to Align left or Align right.
Why are my WordPress images stacking on top of each other?
Each Image block takes a full line by default, so separate images stack. Put them in a Gallery or Columns block, or align each one left.
Do side-by-side images stay side by side on mobile?
It depends on the method. A Gallery block keeps up to two per row on a phone, while Columns blocks and left-aligned images stack by default.
Can I put images side by side without a plugin?
Yes. The Gallery block, the Columns block, and image alignment all come with WordPress and need no code. A gallery plugin helps once you have lots of photos.
How do I add space between images placed side by side?
In Envira Gallery, you set it with Column Gutter Width, or with Automatic Layout: Margins when the gallery is on Automatic. For the Gallery and Columns blocks, look for a spacing option in the block’s Styles settings, which some themes don’t show.
Now your photos can sit side by side, whether it’s a quick pair or a gallery that grows over time. If you’re deciding how a bigger gallery should look, be sure to check out our post on WordPress gallery layouts and which one to use when.
Not using Envira Gallery yet? Get started today!
Don’t forget to follow us on Facebook and X (Twitter) for the best photography tips, resources, and WordPress tutorials.
I’ve been searching high and low for how to do this and this article has been the most helpful. However, does this not work for sites/blogs using photos with captions? I have linked my photos and captions to portfolio pieces on my website, and it’s not allowing me to align side-by-side.
-Brittany
Hey Brittany, did you check this guide? How to Add Caption Below Images in WordPress. Please let us know if this helps or feel free to reach out for any other support you need. 🙂
I have spent the last hour trying to put my photos side by side – these instructions helped, thank you so much!
Hey Sapphire, we are glad it helped you out. Do follow us on Twitter for more exciting WordPress tutorials. 🙂
This saved me a lot of timetime. Thanks