Page navigation in blogger blog

Are you fed up of olderpost newerpost kind of navigation and you wish to add page numbers in your blogger blog here is a way.

1. Login to Blogger Dashboard and navigate to Layout > Edit Html
2. Don’t click the checkbox which says “Expand Widget Templates”
3. Find this

]]></b:skin>

and Replace it with

.paginator {
 margin-top:60px;
 font-size:1em;
}
.paginator table {
 border-collapse:collapse;
 table-layout:fixed;
 width:100%;
}
.paginator table td {
 padding:0;
 white-space:nowrap;
 text-align:center;
}
.paginator span {
 display:block;
 padding:3px 0;
 color:#fff;
}
.paginator span strong,
.paginator span a {
 padding:2px 6px;
}
.paginator span strong {
 background:#ff6c24;
 font-style:normal;
 font-weight:normal;
}
.paginator .scroll_bar {
 width:100%; height:20px;
 position:relative;
 margin-top:10px;
}
.paginator .scroll_trough {
 width:100%; height:3px;
 background:#ccc;
 overflow:hidden;
}
.paginator .scroll_thumb {
 position:absolute;
 z-index:2;
 width:0; height:3px;
 top:0; left:0;
 font-size:1px;
 background:#363636;
}
.paginator .scroll_knob {
 position:absolute;
 top:-5px; left:50%;
 margin-left:-10px;
 width:20px; height:20px;
 overflow:hidden;
 background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgD8FMwWhkH40pTDAIafFa_e5wtsyVCuFfrEuPwI8gYNeMG33f0wHzbfNpK35YDhMWqRGL0Y47pPK3gElIwjmJLTyVlomWow6Td7x7jjVqDrik-N3or76YI51KV65-3_-0T5k8XkBjxEKg/s1600/slider_knob.gif) no-repeat 50% 50%;
 cursor:pointer; cursor:hand;
}
.paginator .current_page_mark {
 position:absolute;
 z-index:1;
 top:0; left:0;
 width:0; height:3px;
 overflow:hidden;
 background:#ff6c24;
}

.fullsize .scroll_thumb {
 display:none;
}

.paginator_pages {
 width:600px;
 text-align:right;
 font-size:0.8em;
 color:#808080;
 margin-top:-10px;
}
]]></b:skin>;

4.Now find this

</body>

and replace it with

<script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000.js' type='text/javascript'></script>
<script type='text/javascript'>
var home_page="/";
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=6;
</script>
<script src='https://blogo.googlecode.com/svn/trunk/page.js' type='text/javascript'/>
</body>

You can edit number of posts and number of pages to be shown by changing postperpage and numshowpage from the above code respectively.

enjoy.........
If you have any doubts ask through comments.Remember to take backup before editing......