Blog Blogger CSS/CSS3 HTML/HTML5 Technology Website

Related Posts Widget for Blogger

Now everyone wants readers of their blog to stick on to their blog, and also no one wants the reader to spend whole his life searching for the posts he/she likes!
So to tackle all these related problems, we have “Related Posts Widget“. A simple to use, a quick handy for all.

Here’s a preview of how it looks,

How to Add this Widget to your Blog?

1.) Go to Design->Edit HTML in your Blogger Dashboard
2.) Download the existing template before you make any changes, just in case if you make any mistakes.
3.) Check the “Expand Widget Templates” box.
4.) Search for the </head> tag.
5.) Add the following code just before the </head> tag.


<script type="text/javascript">
// '); while (i < relatedTitles.length && i < 20) { document.write('

  • ' + relatedTitles[r] + '
  • '); if (r < relatedTitles.length - 1) { r++; } else { r = 0; } i++; } document.write(' '); document.write('Related Posts Widget[?]'); } // ]]></script>

    6.) Now search for <div class='post-footer'>. Sometimes you can also find it as <div class="post-body'">
    7.) Add the following code below the code you just found.

    <div id="related-posts">
    <span style="font-family: Arial; font-size: medium;"><b>Related Posts : </b></span>
    <span style="color: #ffffff;">
    <script type="text/javascript">

    Leave a Reply

    This site uses Akismet to reduce spam. Learn how your comment data is processed.