Numbered Page Navigation for Blogger Javascript



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
and replace with
/* Page Navigation styles */
.showpageNum a {
  padding: 3px 8px;
  margin:0 4px;
  text-decoration: none;
  border:1px solid #999;
  background: #ddd;
.showpageOf {
margin:0 8px 0 0;
.showpageNum a:hover {
  border:1px solid #888;
  background: #ccc;
.showpagePoint {
  text-shadow:0 1px 2px #333;
  padding: 3px 8px;
  margin: 2px;
  font-weight: 700;
  border:1px solid #999;
  background: #666;
  text-decoration: none;
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
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 src=’’ 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
This code determines the number of posts that would be displayed per page.
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