WordPress: The Ultimate Guide to Placing Images Side by Side
WordPress is an exceptional platform for creating visually appealing websites and blogs that leave a lasting impression. As a blogger, you may want to add images side by side in your blog posts, and thankfully, WordPress makes this a breeze. With this guide, we’ll show you how to add two images side by side in WordPress easily without any programming knowledge.
Why Put Images Side by Side?
Have you ever had multiple images of the same topic that won’t fit on just one line if each image is placed separately? In such cases, placing the images side by side is an excellent option. Not only will it improve the readability of your website, but it will also enhance the user experience. With multiple images placed side by side, visitors can identify the relationship among images and save some scrolling. Additionally, inline images can break up the text in the blog post, making it more visually engaging to read.
Adding Two Images Side by Side in WordPress
There are two ways to add two images side by side in WordPress. You can achieve this result with the Gutenberg Editor or using the Classic Editor.
Option 1. Using Gutenberg Editor
The Gutenberg Editor comes by default with WordPress Editor’s latest version, released since WordPress 5.0. With it, you can add two images side by side effortlessly:
- Open the Gutenberg Editor. To do this, navigate through the WordPress dashboard to Posts > Add New.
- Select Gallery Block and Add Images. Once you’re on the WordPress editor screen, click on the plus sign (+) box on the right side and choose ‘Gallery.’
- Upload Images and Select ‘Grid’ Layout. Upload the images you want to add, select the ‘Grid’ layout, and choose the number of columns you need. If you’re adding two images side by side, select two columns.
- Edit Gallery Settings. Customize the gallery to your liking. You can sort the images, add captions, and adjust or crop the images. You can also adjust the alignment and spacing between images.
- Publish and Preview Your Post. Click ‘Publish’ once you’ve customized the gallery block to your liking and preview your post to see how your images will appear.
Option 2. Using Classic Editor
Suppose you’re still using the older version of WordPress known as the Classic Editor. In that case, you can still add two images side by side effortlessly:
- Open Classic Editor. From the WordPress dashboard, navigate to Posts > Add New. In the post editor, add the required text and place the cursor where you want to add the images.
- Add Images. Click on the ‘Add Media’ button and upload the images you want to add. Once you’ve uploaded the images, select both images by clicking on them while holding the shift button on your keyboard.
- Create a Gallery. Click on the ‘Create a Gallery’ button on the left-hand side of the screen. In the gallery settings window, choose a ‘Link to’ option and select ‘Media file’ for a better user experience.
- Select the Number of Columns. Choose the number of columns for placing two images side by side. For this, select 2 columns in the ‘Columns’ option.
- Add Caption (Optional). Adding captions is optional. You can add captions to each of these images by clicking on the ‘Attachment Details’ and typing in the ‘Caption’ field below the title.
- Preview and Publish. Once you’ve selected the number of columns and added captions (if you want to), click on the ‘Create Gallery’ button, then click ‘Insert Gallery’ button. Preview your post once you’re done to ensure that your images are side by side.
Images of different dimensions may impact the final appearance of images side by side. To ensure that your images appear aesthetically appealing, it’s essential to have them resized to similar sizes. You can quickly resize images from within WordPress. After uploading your images, click on the image to open the image editor. Then, click on the ‘Edit Image’ button to adjust the image’s height, width, and other modifications manually.
Adding images side by side makes your WordPress content more visually appealing, enhancing the user experience. With this guide, we’ve outlined two ways to add two images side by side, using either Gutenberg or Classic Editor. Remember to resize images that are not similarly sized while adding images side by side. Inline images are a great way to break up text in a blog post and make it more visually engaging. Your readers will appreciate the effort made to create an aesthetically pleasing appearance that enhances their reading experience.