Related Post By Label Widget

A relatively easy method of increasing page views on your blog is to add a list of related posts below each article. This offers readers a ready-made reading list of other articles on your blog, which are of a similar theme or subject matter.

You will see it when you when you click on any of the post it will be shown under the post. You can see it in my blog also.

Sign in to Blogger

Dashboard --> Layout --> Html (Check Expand Widget)

Search for the following:(Use Ctrl+F for easy searching)

<p><data:post.body/></p>

Now paste the following code right after it.

<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<!-- *****************http://hoctro.blogspot.com*****Jan,2007****************** -->
<!-- *****************Related Articles by Labels - Take Two****************** -->

<!--
Modified by Hoctro 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'/>
<div id='hoctro'>
</div>
<script type='text/javascript'>

var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 10;
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>

Note : Always back up your template before doing this or preview it before saving.

Credit : Hoctro
Digg Google Bookmarks reddit Mixx StumbleUpon Technorati Yahoo! Buzz DesignFloat Delicious BlinkList Furl

Related Posts

13 comments: on "Related Post By Label Widget"

Tarun said...

wow ..thks re

and u r new theme .rock man ..!!

Arjun said...

hEy... ur blog is too good man.. really
I may not use this present post article, but u have a wonderful place here....
Bookmarked u long back....

nice template ...

Cheers..!!
Arjun

Majid said...

this is so great yaar .....

thankx re....

Shilpa said...

very informative content though i tried tag cloud but all in vain :( newys will ask u 4 help i guess i need it

Dan* said...

when your preview it see the errors in the red line hopw it will help. You might not have close the codes properly......

Varun said...

hmm nice one! would try it,but first I must get rid of something I already have in my template..can't let it get too cluttered :)

Hakuna Matata said...

Hey i remember seeing this in the wordpress blogs and envying it. Thanks for the code!

Arjun said...

Actually my new blog is going be by my genuine name. Try not to be publish this comment, & that blog is going to give Special Credit to your blog & you.

Thank you very very much for everything

RINZU SUSAN RAJAN said...

i cundt find the place where it could be pasted... cant it paste it in place for add widget like i did for right click disable...
please help

Dan* said...

@ Rinzu

No you have to edit your html. Use Ctrl+F or go to edit and click Find. Type the code you will see it paste it right after it

DInah said...

wow, this is cool! already installed this in my blog!thanks a lot!
if you can just point me on where i might find tricks on making my navigation buttons to look like yours, i would be most grateful :-)

Unduh Software Full Version said...

i used the same theme with u,
but cant found html code

Post a Comment