How to Put Images Side by Side in Blogger (Easily)

1 komentar

How to Put Images Side by Side in Blogger


Do you want to put images side by side in your Blogger content?

Often beginners struggle to find how to put two pictures next to each other in their Blogger posts and pages.

In this step by step guide, we will show how to easily put images side by side in Blogger

We are going to use an HTML table for this purpose and by this the method you can align images in posts as well as in blogs.


Aligning Images in Post


First thing first, copy all your image links in a notepad file or any text document editor you have. To grab the image link just upload your images in the post editor and then click on 'HTML' on the top left. There you will see your image link somewhat like this


https://1.bp.blogspot.com/-HUToqo9hZ_s/XwQEeEPpr9I/AAAAAAAACVc/KhrirTyIj90It3_mgiYnydBl4hQ7hKrXwCK4BGAsYHg/w640-h396/images-side-by-side-blogger.jpg


Okay, now you have your image links. Copy this HTML table code and paste it in HTML mode in the post editor.


<table>
  <tr>
    <td><img border="0" width="
100px" height="100px" src="IMAGE 1 LINK HERE" /></td>
    <td><img border="0" width="
100px" height="100px" src="IMAGE 2 LINK HERE" /></td>
    <td><img border="0" width="
100px" height="100px" src="IMAGE 3 LINK HERE" /></td>
  </tr>
</table>


That's it. Now, your images will appear side by side in your blog post. See the code working here

Image 1 Image 2 Image 3

Customize

  • You can change the size of the image by changing the value in height and width. 
  • If you want to add more images in one line then just copy and paste the <td> code.
  • If you want to add a link to your image then click on your image in compose mode and then click on 'Link' in the toolbar.


Put Images Side by Side in Blog

If you want to align 2 or more images in your blog on the homepage then just copy the code above and paste it in 'HTML/Javascript' gadget.

Don't forget to change the links in the code.


If you don't know how to add this gadget then follow these steps:-

  1. Go to 'Layout'
  2. Click 'Add a Gadget'
  3. Select 'HTML/Javascript' gadget
  4. Paste code
  5. And save

I hope you successfully Put Images Side by Side in Blogger blog posts to make your articles look more professional. If you liked this article then do share this with your friends and if you have any queries or doubt regarding this article then drop a comment in the comments section below, I will get back to you with a new article till then stay tuned.
XRaju
Website Designer, Blogger and an Engineer. Cybersecurity student and the founder of this Blog.

Related Posts

1 komentar

Posting Komentar