Blogger Optimised : Add Auto Friendly Links Related Posts Below Articles.

Hello Blog-gers. Today we're going to discuss and provide you with some tips and tricks in adding a search engine URL friendly related posts links automatically below every post. There will be some tweaking in your HTML, so do keep in mind to save your template before you begin.

How can it optimised your blog pages?

1. No images 'call' on pages - Not like some of the LinkWidgets used.
2. The 'call' for javascripts/iframe from 3rd party widget providers.
3. Specify pages - Strong inter-page relation.
4. Specify location for easy indexing - Under posts not under comments.
5. Specify the amount of links in every post - posts internal/external links balance.
6. Help in lowering your bounce rate - Visitors are most likely to click on related articles links.

We will not go to detail why this tweak is search engine friendly, because like the above, says it all. It is some of the many features that you can do in making your blog pages more search engine and user friendly. The point here is to keep your web visitors to keep on reading your posts/articles, and not just by reading your current articles. By doing this, it makes the relation between page browsing more effective and conveniently to users. If not, they will probably miss out any of your relevant pages. In another way, you will gain more exposure and quality visits and lowering your visitors bounce rate.

Tutorial

Javascript Call

1. Go to your blogger page - blogger.com
2. Go to Template > Backup/Restore - Save your current page in your PC.
3. Go to edit HTML > Proceed > expand Widgets Templates
4. Find this code </head> - You can also use F3 or Ctrl-F.
5. Copy the code below before/above </head>  in edit HTML.

<!--RelatedPostsStarts-->
<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 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #054474;
font-size : 11px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url(&quot;http://www.gigaimage.com/images/brrl1rtaziisu0yj6kj6.gif&quot;) no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}
</style><script src='http://bloggergadgets.googlecode.com/files/related_posts_compressed.js' type='text/javascript'/><!--RelatedPostsStops-->

The Automated Posts/rticle Link Script

1. Now, find this code  <data:post.body/>  - use F3 or Ctrll-F. 
2. Copy this code and paste underneath/below  <data:post.body/> 

<!--RELATED-POSTS-STARTS-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font face='Helvetica' size='3'><b>Artikel Berkaitan: </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=3&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script></div></b:if>
<!--RELATED-POSTS-STOPS-->

1. Click Preview and wait if page parsed correctly.
2. If no errors, press Save and you're done.

Related  Posts Automated Links

Additional Note:

1. Change the title of the links by changing the highlighted words above.
2. Change the frequency of your post links, by changing the number highlighted above.
3. Important to organise your posts as the automated links produced is based on your Posts Labels articles and posts.
4. Your links location will look like screenshot.

The tweak above is tested and suitable for blogspot blogger platform using Wordpress Themes and any blogspot customised templates. The links generated from your previous title posts (articles) in your selected labels. You can call as many links required by changing the frequency as stated above. And again, for better page optimisation, try to balance the amount of links internally and externally. Thanks for the support from bloggerstop.

However you must consider, as SEO page optimisation is like life, at one time you'll be at the top, the next, you will just fall. But by tweaking and updating your web pages, you won't be far behind.

Updated August 2012: The javascripts (highlighted in blue) had a few glitches lately. But the ultimate blogger widget guru from bloggerplugins had updated the related post to labels links and now it is working accordingly.