This post teaches you how to add a section of "related" posts of yours at the end of the posts. The related posts are those that have the same labels as your current post.
You can either add it as a widget or in a footer section (which I think is so much better because the bottom of the page usually don't draw much attention and your reader might just fail to see it.)
If you want to add a widget, follow the instruction here:
http://purplemoggy.blogspot.com/2006/12/related-posts.html
A few words of note. First of all, this is a complicated task. You are adding a script to search through the labels of your post and show each post in the same label as the current post has. That's why you need to add several parts and you need to be careful not to make mistakes otherwise, weird things happen like your posts won't show up etc. So back up before you make any changes.
Add this to the header section, ie, in between <head> and </head>:
<script type="text/javascript">
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
}
//]]>
</script>
If you have this : <p class='post-footer-line post-footer-line-2'/>
change that to <p class='post-footer-line post-footer-line-2'> </p>
If you already have <p class='post-footer-line post-footer-line-2'> (something in between) </p>
then that'll work. And of course, you can put it in line 3 but it must be after the line-1 lable section.
Then add the following code in between the <p class=...> and </p>
<span class='Related-Posts-of-Mine'>
<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<div class='widget-content'>
<script type='text/javascript'>
document.write("<h1>Related Posts of Mine</h1>")
</script>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>
</b:if>
</span>
Then the work is done :). See if it works. I actually went through much more trouble to get here because I am a blog starter so I just kind of figured it out with tries and errors. So I suppose this is the easiest way to do this and feed me back if it works or doesn't work.
No comments:
Post a Comment