Related Post Widget for Your Blog.

Related post widget is a great way of keeping your readers engaged by helping them to navigate from one post to another in an easy way. It is a great way of reducing bounce rates and increasing traffic to your blog.

Related post widget for Blogger
Related post widget for Blogger

Normally what happens is a person lands up on one of of your blog's article, read it and then just leave. What if you provide some related articles to the one he is reading at the end of he post? Chances are that he will go on to read some more. This will improve your bounce rate and increase traffic to your blog.

There are many related post widgets options for you. I will be discussing all those in coming days. But the one I liked most is I am going to discuss.

▌ Add related post widget to your blog.

♦ Go to and fill out the forms.

Blog URL: Something like

Mode: You can select related post widget or Recent post widget according to your preference.

Max post: The number of related/recent posts you want to show.

Show titles/thumbs?: If you want your title or a thumbnail (an image from the article) to be displayed.

Thumb size: To select the size of thumbnail image that will appear. There is a list of sizes that are allowed. Choose according to your preference. "-c" is used to crop the image. I will suggest you to use cropped thumbs since not using it will create uneven thumbs and will not be soothing to eyes of readers.

♦ If you are done with above procedure, its time to select the style and appearance of the related post widget.

There are 4 modes available and these modes look like this:

Demo 1


Demo 3

Demo 4

You can select any of these 4 modes according to your choice.

♦ Adding related post to your blog: Now, to add related post to your blog, copy and paste the generated code to HTML/Javascript Gadget in your Blogger layouts and you are done.!!

You have successfully added related post widget to your blog.

▌ Features.

♦ Display related posts with/without thumbnails.

♦ Since, images added to Blogger posts are uploaded to PicasaWeb, you can use many custom thumbnail sizes.

♦ You can use one of 2 CSS styles to help you get started quickly.

♦ Display posts with transition effects or as a fixed list.

♦ Many transition options are available like opacity, width, height, font-size.

♦ Optional timeout technique is used to finish widget loading when one or more feed requests were not completed successfully, instead of waiting indefinitely.

♦ Thumbnails loading is delayed until widget has finished aggregating related posts to avoid loading extra images

♦ You can customize it by placing optional parameters -like custom animation- in a HTML comment or HTML5 data attribute.

♦ You can disable widget if current page is not a post page.


ambarish kumar

  • Image
  • Image
  • Image
  • Image
  • Image
    Blogger Comment
    Facebook Comment


Post a Comment