Related Post Without Plugin For Blogger

We all love showing our old links in our site and blog, what if this process becomes automatic. I think all will love it as then we don't have to put our link in between the post or will put less links. Putting Related Post in every post also give your users a better way to navigate or they can directly see same types of post. Subscribe to Syconet World by Email. To put related post widget in your post just follow below instructions.

How to Show Related Post Without Plugin For Blogger

1.Go the dashboard of your blogger account and go to design.

2.Now go to HTML and check the "Expand Widget Templates" box.

3.Now search for below code

</head>

4. And add the below code just above the code in 3.i.e head tag.

<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://img502.imageshack.us/img502/7084/rsst.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://troubleshoot4free.com/download/Related_posts_Syconet.js' type='text/javascript'/>

5. Now find below code

<data:post.body/> or <div class='post-body>
or <data:post.body/>

6. Now just after the code in 5 put the below code

<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>

7. Now just take a Preview of your template to check everything is fine.
8.Save your Template.

If you still having problem then you can leave your comments or Subscribe to Syconet World by Email for more blogger tricks.

Advertisements