Insert Image Gallery in Blogger

    

This post will explain how to insert a responsive  image gallery in your blogger website.

    Galleries are an excellent way to display multiple images without making the user scroll through an extended slow-loading page. This tutorial will show you ways to insert an image gallery during a grid layout with rows and columns. You could use an image gallery to feature a portfolio, project gallery, recipe gallery or a visible archive page that links to separate posts on your blog. you can add a gallery in separate posts to describe a set of images like travel photography, external products, etc.

    There is just a very simple way to do this.

Here are a few steps that you have to follow for Image Gallery.

• Sign in to your blogger.
• open blogger dashboard. 
• Click the "Layout" button on the left sidebar of your dashboard.
• You may add an image gallery anywhere you like on your blogger website.
• It is highly recommended that you insert Gallery in the sidebar.
• Look for your sidebar.
• Now click on add a gadget.
• From the pop-down menu, select HTML/Javascript gadget.
• Click on it.
• In the title, type "Image Gallery" as the Title of your gadget.

HTML Code for image gallery:

Paste this code in the content box.
<table style="width:100%">
<tr>
<td> image address </td>
<td> image address </td>

<td> image address  </td>

</tr>

</table>

How to add multiple rows in image gallery:

• If you want to add multiple rows, copy the code from <tr>  to  </tr>

• In this way, you can add multiple rows in your gallery.

• The <tr> tags shows table row. This gallery shows that there is one row having three images in it. 

• <td> tag shows the number of images between <tr> and </tr> tags.

How to insert images in Image Gallery:

• Go to posts.

• Click on Add new.

• You don't need to give any title to the post.

• just click on the Insert image button.

• Select From the Blog.

• Select multiple images that you want to insert in the gallery.

• Click on the Select button.

• All selected images are added to your new post.

How to paste image address in the image gallery:

• On post editor, clik on pen icon in upper left corner of post editor.

• select HTML view.

• select images address one by one.

• Paste that address in HTML/Javascript gadget between <td>  image address </td> in place of "image address"

• You are completely done now.

• Save the gadget and also save arrangement.

• Go to your blogger website.

• Refresh it. 

• You will see  a beautiful gallery inserted in the sidebar of your blogger website.

• Enjoy Now.

Click Here to Download Code File

Click here to watch the video

Click here to visit our Channel for more tutorials

Click Here to Play Online Free Games