Cara Mengganti Posting Lama/Baru dengan navigasi Angka

Tanpa panjang lebar lagi,yukz langsung aja ke intinya!
Seperti biasa Pergi ke Dasbor Edit HTML jangan lupa centang Expand Template Widge!
CTRL+F ketik </body> masukkan kode berikut di atasnya

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>
<!--Page Navigation Ends -->

Selanjutnya Untuk Style Tinggal pilih Lihat Gambar dibawah:
Kita disini hanya menambahkan kode di atas Code ]]></b:skin>

copy dan paste code berikut taruh di atas Code ]]></b:skin>  dan SAVE :P

.blog-pager,#blog-pager{
  font-family:"Times New Roman", Times, serif;
  font-weight:normal;
  width:500px;
  font-size: 0.8em;
  padding: 0.6em 0.5em;
  background-color:#000000;
  text-align:center;
 }
.showpageNum a,.showpage a {
  text-decoration: none;
  padding: 0.3em 0.5em;
  color: #055d90;
  white-space: nowrap;
  color: #ffffff;   
   margin-right: 0.1em;
  } 
.showpageNum a:hover,.showpage a:hover {
 color:#A30A1A;
 text-decoration:none;
 background-color:#ffffff;
  }
.showpageOf{
  margin:0 8px 0 0;
  display:none;
  }
.showpagePoint {
    color:#ffffff;
    text-decoration:none;
    background-color:#A9061B;
    width:36px;
    height:16px;
    font-size:12px;
    padding-left:5px;
    padding-right:6px;
    padding-top:3px;
    padding-bottom:4px;
  }

.blog-pager,#blog-pager{
  font-family:"Times New Roman", Times, serif;
  font-weight:normal;
  width:500px;
  font-size: 11px;
 }
.showpageNum a,.showpage a {
  display: block;
  float: left;
  padding: 3px 5px 3px 5px;
  margin-right: 3px;
  border: 1px solid;
  color: #FF6400;
  border-color: #FF6400;
  background: #FFF url(http://i1133.photobucket.com/albums/m596/abu-farhan/Meneame.png) bottom left repeat-x;
  text-decoration:none;
 } 
.showpageNum a:hover,.showpage a:hover {
  border-color: #FF9400;
  background: #FFBE94;
  color: #FF6400;
  }
.showpageOf{
  margin:0 8px 0 0;
  display:none;
  }
.showpagePoint {
  border-color: #FF9400;
  background: #FFBE94;
  color: #FF6400;
  border: 1px solid;
  font-weight: bold;
  display: block;
  float: left;
  padding: 3px 5px 3px 5px;
  margin-right: 3px;
  }

.blog-pager,#blog-pager{
  font-family:"Times New Roman", Times, serif;
  font-weight:normal;
  width:500px;
  font-size: 11px;
  padding: 0.6em 0.5em;
background: #3E3E3E;
 }
.showpageNum a,.showpage a {
  text-decoration: none;
  padding: 0.3em 0.5em;
  color: #055d90;
  white-space: nowrap;
  background: #3E3E3E;
  color: #ffffff;   
      margin-right: 0.1em;
  } 
.showpageNum a:hover,.showpage a:hover {
    background: #EC5210;
  }
.showpageOf{
  margin:0 8px 0 0;
  display:none;
  }
.showpagePoint {
  text-decoration: none;
  padding: 0.3em 0.5em;
  color: #055d90;
  white-space: nowrap;
  background: #313131;
  color: #868686;   
  margin-right: 0.1em;
  }

.blog-pager,#blog-pager{
 font-family:Arial, Helvetica, sans-serif;
 font-size:11px;
 width:500px;
 text-align:center;
 }
.showpageNum a,.showpage a {
 float:left;
 line-height:14px;
 padding:2px 4px 0;
 min-width:8px;
 border:1px solid #d7dce0;
 color:#848a8c;
 text-decoration:none;
 margin:0 3px;
 } 
.showpageNum a:hover,.showpage a:hover {
 color:#fff;
 background:#7f8487;
 border-bottom-color:#848a8c;
 }
.showpageOf{
  margin:0 8px 0 0;
  display:none;
  }
.showpagePoint {
 color:#fff;
 background:#7f8487;
 border-bottom-color:#848a8c;
 float:left;
 line-height:14px;
 padding:2px 4px 0;
 min-width:8px;
 border:1px solid #d7dce0;
 text-decoration:none;
  }

.blog-pager,#blog-pager{
 font-size: 11px;

font-family:verdana;
 padding: 0.2em 0.5em;
 margin-right: 0.1em;
 border:1px solid #FFF;
 background: #FFF; text-decoration: none;
 width:500px;
 }
.showpageNum a,.showpage a {
 color: #693;
 text-decoration: underline;
 border: 1px solid #E3E3E3;
 text-decoration: none;
 padding: 0.2em 0.5em;
 } 
.showpageNum a:hover,.showpage a:hover {
 border: 1px solid #693;
  }
.showpageOf{
  margin:0 8px 0 0;
  display:none;
  }
.showpagePoint {
 border: 1px solid #693;
 padding: 0.2em 0.5em;
 font-weight: bold;
 background: #693; color: #FFF;
  }

NB :  Untuk ukuran besar kecilnya silahkan ganti Code yang berwarna MERAH

untuk mengganti warna supaya sesuai keinginan. Silahkan ganti code warnanya dengan warna yang di inginkan :)

CODE WARNA