I would like to share a useful tip I recently discovered for arranging three images next to each other in Mailchimp. As a blogger and marketer, I frequently utilize Mailchimp for sending out newsletters and promotional emails, and I constantly aim to make them visually engaging. Therefore, when I needed to insert three images in a line, I encountered a bit of confusion since Mailchimp’s pre-set image block only permits one image per block.
After some trial and error, I found a workaround that allows you to put three images side by side without much hassle. Here’s how you can do it:
Step 1: Prepare Your Images
The first step is to prepare your images. Make sure they are of the same dimensions and aspect ratio, as this will ensure they align properly when placed side by side. You can use any image editing software to resize and crop your images if needed.
Step 2: Insert a 3-Column Table
Next, you need to insert a 3-column table in your Mailchimp campaign. To do this, click on the “Build” tab in the Mailchimp editor and select the “Basic” category. Then, drag and drop the “Code” block into your campaign.
Within the code block, insert the following HTML code:
<table style="width:100%;">
<tr>
<td style="width:33%;"><img src="image1.jpg" alt="Image 1"></td>
<td style="width:33%;"><img src="image2.jpg" alt="Image 2"></td>
<td style="width:33%;"><img src="image3.jpg" alt="Image 3"></td>
</tr>
</table>
Replace “image1.jpg”, “image2.jpg”, and “image3.jpg” with the URLs or file names of your images, and add alt text for accessibility purposes.
Step 3: Customize the Table
Now that you have inserted the table, you can customize it to match your email design. To change the width of the columns, modify the “width” value in the “td” elements. For example, if you want each column to take up 25% of the width, change the “width” value to “25%”. You can also add padding or borders to the table to make it visually appealing.
Additionally, you can add text or captions below each image by inserting a new row after the image row and using the “td” elements for text.
Step 4: Test and Send
Before sending your email, make sure to preview and test it in different email clients and devices to ensure the images and table layout are rendering correctly. Once you’re satisfied, you can send your email to your subscribers and impress them with your beautifully designed layout!
Conclusion
Putting three images side by side in Mailchimp may not be as straightforward as it seems, but with a little bit of HTML coding, you can achieve the desired layout. By using a 3-column table and customizing it to match your email design, you can create visually appealing newsletters and promotional emails that will captivate your audience.
Remember to always test your email campaigns before sending them out to ensure optimal rendering across different email clients and devices. Happy designing!