Related Posts
Have you ever wanted a feature under your post that shows related posts from your blog? I found this way to do it from JackBook.com. It was originally designed by Hoctro with modifications by JackBook. This uses labels/categories that you already have in place to show Related Posts by Category.
There are two steps to this hack. But before you begin, be sure to save your template!
Step 1: Go to your Dashboard | Layout | Edit HTML | check Expand Widget Templates and locate this code:
<data:post.body/>Step 2: Place this code after the code you just located:
<b:if cond='data:blog.pageType == "item"'>Save your work and all is done.
<div class='similiar'>
<!-- ***http://hoctro.blogspot.com***Jan,2007**** -->
<!-- ***Related Articles by Labels - Take Two*** -->
<!--
Modified by JackBook.Com to make it easier to use.
1. Now, users don't need to change anything to use this widget. just copy and paste, and done!
2. The current article will also be listed, now it's no more.
-->
<div class='widget-content'>
<h3>Related Posts by Categories</h3>
<div id='data2007'/><br/><br/>
<div id='hoctro'>
Widget by <u><a href='http://hoctro.blogspot.com'>Hoctro</a></u> | <u><a href='http://www.jackbook.com/' title='Related Posts on Blogger Modified by JackBook.Com. Read More?'>Jack Book</a></u>
</div>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>
15 Comments:
I'm not so sure I'd use this code as "jack book" points to "sexy news - jackbook.com"... thoug the code is tempting as I've seen it on other blogs so often (not blogger). But why does it only get put to use when you want to comment or go to that post's page? And if I only want 4 related post, how do I modify the code?
I did know the related post modify code but now I forgot the code.
Thanks for the info. I loved your post.
I used several snippets of code from several different sites to achieve the same function. Also, keep in mind that the "related posts" will only appear on your permalinked pages.
nice share ... i'll try it right now..
thanks
I have enjoyed reading your comments about blogging. You sure know what you are doing. I'm starting a blog at http://www.knowinglove.org where others can share thier stories of knowing love. I've shared some of my own personal reflections and was hopeing others would but no one is commenting Yet.
How would you suggest I get it jump started?
Thank you.
Cliff Jones
@Cliff, I just kept blogging. In the beginning comments were few and far between. But, I would post on some forums and leave my link and eventually traffic picked up. Try Entercard. That generates a lot of traffic.
Great idea Annie, I added it to my site and lets see if it make a difference to incoming traffic or page views per visitor, fingers crossed anyway!
It's always nice to read your tips on how to make my blog look more personalized...also the information you've provided are very easy to understand...especially for newbies like me.
Thats what i looking for!
Thanks
Thank very useful for
BlogU
Thank you so much for this very usefull explanation.
I have to admit that this is quite a piece of code and without your help we couldn´t have it done alone.
really useful information thanks alot
> There are two steps to this hack.
amazing. So easy!
Amazing...Loved your blog..Everything going fine after implementing this hack.Working way to decrease bounce rate.