Irsah in Designs


Blog Pages Optimised




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.

We will not go to detail why this tweak is search engine friendly, because like the above, says it all. These are some of the many features, that you can do in making your blog pages more search engine and user friendly. You do want your web visitors to keep on reading your posts right, 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.

Tutorial

CSS and 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 Temoplates
  4. Find this code  - 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/Article 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 == "item"'>
<div id='related-posts'>
<font face='Helvetica' size='3'><b>Recent Articles:</b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name></data:label><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=3"' type='text/javascript'></script></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script></div></b:if>
<!--RELATED-POSTS-STOPS-->
Code Source: Creative Some : Blogger Tricks and Hacks
  1. Click Preview and wait if page parsed correctly.

  2. If no errors, press Save and you're done.

     

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

  3. Important to organise your posts as the automated links produced is based on your Posts Labels entries.


The tweak above is tested and suitable for blogspot blogger platform using Wordpress Themes and any blogspot 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.

Glad to share a quick tutorial on: Blogger Pages Optimised Add Auto Friendly Links Below Blog Posts.