How to create a related posts list and place it right at the end of the content

A list of related posts of the same label placed right after the post content
A list of related posts of the same label placed right after the post content

Notice that at the end of every post in Almost a Technocrat blog, there is a list of related posts generated for you to continue browsing this blog. This is actually a done by a javascript and the posts listed are filed under the same labels as the current post. How cool is that right?




This post is my personal reminder on how to implement this related posts script in case I will need to do it again. Feel free to use it.

Step 1 : Download this jquery script and host it from your own server.

Step 2 : Download this related posts widget script and host it from your own server.

Step 3 : Copy and paste the block of code below to just right above the </body> tag in your Blogger theme template code. Alternatively you can also create a HTML/Script widget in the Layout Tab and place the widget to the lowest location you are able to.

<!-- Related Posts -->
<script  src="path-to/jquery-1.3.2.min.js" type="text/javascript">
</script>
<script  src="path-to/related-posts-widget-1.0.js" type="text/javascript">
</script>
<script type="text/javascript">
  relatedPostsWidget({
"containerSelector":"div.post-body"
,"loadingText":"loading..."
,"relatedTitle":"Thank you for reading. You might like to read these too. They are related posts in the same category:"
  });
</script>

Step 4 : Replace the path-to with the location where you have host the scripts.

Step 5 : You can replace the title highlighted in green with your own title.


Comments

  1. Hello Boon Seong, you can tell me which part of the template I have to put the code.

    ReplyDelete

Post a Comment

Thank you for visiting Almost a Technocrat. Due to many spam comments, your comment will be moderated.

Popular posts from this blog