The Blog Paging Beautyful

       As many of your posts if only show up one page will cause a  blog look very cumbersome and long make not beautiful blog, we will show you their opinion, the blog paging will make your blog I look very neat and beautiful, paging topic specific pages of the blog.
      To paginate the blog we'll create a widget in the blog then we paste the following code and click save is finished:

  

<style>

.showpageArea {font-size: 20px; width:500px;background: url(http://newstodayblogger.blogspot.com) no-repeat left top; padding: 10px; color:#09093d;text-align:center;

}

.showpageArea a {

color:#09093d;

text-decoration:underline;

}

.showpageNum a {

text-decoration:none;

color:#09093d; border:1px solid #fff;

margin:0 10px;

padding:0 5px 0 8px;

}

.showpageNum a:hover {

color:#09093d; border:1px solid #09093d;

background-color:#fff;

}

.showpagePoint {

color:#09093d;

margin:0 8px 0 4px;

}

.showpage a {

text-decoration:none;

color:#09093d;

padding:0 2px 0 4px;

}

.showpage a:hover {

color:#09093d;

text-decoration:underline;

} .showpageNum a:link,.showpage a:link {

text-decoration:none;

color:#09093d;

}

</style>

<script type="text/javascript">

function showpageCount(json) {

var thisUrl = location.href;

var htmlMap = new Array();

var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";

var isLablePage = thisUrl.indexOf("/search/label/")!=-1;

var isPage = thisUrl.indexOf("/search?updated")!=-1;

var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";  

    thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;

var thisNum = 1;

var postNum=1;

var itemCount = 0;

var fFlag = 0;

var eFlag = 0;

var html= '';

var upPageHtml ='';

var downPageHtml ='';

var pageCount=5;

var displayPageNum=5;

var firstPageWord = '';

var endPageWord = 'Last';

var upPageWord ='&#9668;';

var downPageWord ='&#9658;';

var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {

  var timestamp = post.published.$t.substr(0,10);

  var title = post.title.$t;

  if(isLablePage){

    if(title!=''){

        if(post.category){

      for(var c=0, post_category; post_category = post.category[c]; c++) {

        if(encodeURIComponent(post_category.term)==thisLable){                    

          if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){

            if(thisUrl.indexOf(timestamp)!=-1 ){

              thisNum = postNum;            

            }

            postNum++;

            htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;

          }              

        }    

      }

    }//end if(post.category){

     itemCount++;

   }

  }else{

    if(title!=''){

      if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){

        if(thisUrl.indexOf(timestamp)!=-1 ){

          thisNum = postNum;

        }

        if(title!='') postNum++;

        htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;

      }    

    }

    itemCount++;

  }

}

for(var p =0;p< htmlMap.length;p++){

  if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){

    if(fFlag ==0 && p == thisNum-2){

      if(thisNum==2){

        if(isLablePage){

          upPageHtml = labelHtml + upPageWord +'</a></span>';        

        }else{

          upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';

        }

      }else{

        upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';

      }

      fFlag++;

    }

    if(p==(thisNum-1)){

      html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';

    }else{

      if(p==0){

        if(isLablePage){

          html = labelHtml+'1</a></span>';

        }else{

          html += '<span class="showpageNum"><a href="/">1</a></span>';        

        }

      }else{

        html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';

      }

    }

    if(eFlag ==0 && p == thisNum){

      downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';

      eFlag++;

    }

  }//end  if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){

}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){

  if(!isLablePage){

      html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';

  }else{

      html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';

  }

}

  html = '<div class="showpageArea"><span >Page '+thisNum+' / '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){

  html += downPageHtml;

  html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';

}

if(postNum==1) postNum++;

  html += '</div>';

  if(isPage || isFirstPage || isLablePage){

    var pageArea = document.getElementsByName("pageArea");

    var blogPager = document.getElementById("blog-pager");

    if(postNum <= 2){

        html ='';

    }

    for(var p =0;p< pageArea.length;p++){

      pageArea[p].innerHTML = html;

    }

    if(pageArea&&pageArea.length>0){

      html ='';

    }

    if(blogPager){

      blogPager.innerHTML = html;

    }

  }

}

</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>

      You can change blue link by URL your blog. 

      Wish you success