›› Related Post Widget For Blogger Blog
Hello Friends,
In This Post i'll make you learn how to install related post widget in your Blogger Blog.
It is very easy to install. Now Let's talk about the features About the Related Post Widget.
In This Post i'll make you learn how to install related post widget in your Blogger Blog.
It is very easy to install. Now Let's talk about the features About the Related Post Widget.
- Increases Traffic to your Site
- Visitors Stay engaged
- Highly intelligent Only Displays the related post of the current label unlike others.
Ok Now Enough Let's install on your blog.. It will take only one minute to install 
.
So here We Go...
Step 1:
Go to Dashboard » Design » Edit Html » Tick the Expand Widget Template.
Now find the Following Code by pressing Ctrl+F :
.So here We Go...
Step 1:
Go to Dashboard » Design » Edit Html » Tick the Expand Widget Template.
Now find the Following Code by pressing Ctrl+F :
</head>
Now Paste the Bellow Code Just above it<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("http://lh3.ggpht.com/_cNpXRtRph18/S76dASm3WGI/AAAAAAAAEJg/AVmw4HhRdsk/rss.png") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://sidharth12.googlecode.com/files/Related_posts_hack.js' type='text/javascript'/>
Great now you have completed Step 1, Let's Proceed To Step 2
Step 2
Now Find this code :
<data:post.body/>
Now immediately Paste The Below code above the it.
<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>
Now Hit on preview if everything is alright click on save template.
Customization:
You can change the Number of related post to be displayed by changing the number which is highlighted in red color.
If you have any problems or questions feel free to ask in the comments
Note:
If While finding the
<data:post.body/> code is coming three time This Problem comes when we install Auto Read Hack in our Blogs
For this Problem Search for any one line from below and Put Above Section of Wdget Code after it!
<div class='post-footer-line post-footer-line-1'><div class='post-footer'><b:if cond='data:blog.pageType == "item"'>
<data:post.body/>About Me
- Sidharth
- This is Sidharth, the proud admin of ILibrary. He is a student(+2) and aspires to be Popular..... He likes to Share his works and so here is the Platform Where he is going to share all his works.... Never miss out a post...... Follow us By email to keep yourself up to date !!!!