Numbered Page Navigation for Blogger Javascript

                                       

              Steps:

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

3.Now find
]]></b:skin>
and replace with
/* Page Navigation styles */
.showpageNum a {
  padding: 3px 8px;
  margin:0 4px;
  text-decoration: none;
  border:1px solid #999;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  background: #ddd;
  }
.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
  border:1px solid #888;
  background: #ccc;
  }
.showpagePoint {
  color:#fff;
  text-shadow:0 1px 2px #333;
  padding: 3px 8px;
  margin: 2px;
  font-weight: 700;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  border:1px solid #999;
  background: #666;
  text-decoration: none;
  }
]]></b:skin>
This is the CSS part. You can change it according to your template. If you not sure comment below, i will help you.
4. Now find
</body>
and replace with
<!–Page Navigation Starts–>
<script type=’text/javascript’>
var home_page=”/”;
var urlactivepage=location.href;
var postperpage=5;
var numshowpage=4;
var upPageWord =’Previous’;
var downPageWord =’Next’;
</script>
<script src=’http://mybloggertricksorg.googlecode.com/files/colorizetemplates-pagenav.js’ type=’text/javascript’></script>
<!–Page Navigation Ends –>
DO YOU LIKE  Facebook popup like box with timer for bogger

There are some customization parameters in this code
varpostperpage=4;
This code determines the number of posts that would be displayed per page.
varnumshowpage=6;
This code determines the number of additional page navigation numbers that will be displayed on the page.
var upPageWord =&#39;Previous&#39;;
downPageWord =&#39;Next&#39;;
now save the template