• Pertama Silahkan Sobat Login Ke Akun Blogger Sobat.
• Masuk Rancangan Lalu Pilih Edit HTML Dan Awas Jangan Sampai Lupa Centang Expand Template Widget.
• Untuk Berjaga jaga Takut Ada Kerusakan Silhkan Sobat Backup Template Sobat Dulu.
• Bila Langkah Diatas Sudah Mantap Selanjutnya Sobat Cari Kode ]]></b:skin> Pada Template Sobat.
• Kalau Udah Ketemu Kode Diatas Silahkan Sobat Copy Kode Berikut Dan Taruh Tepat Diatas Kode ]]></b:skin> Tadi.
  
  
  /* Page Number */
  .showpageArea a {
  color:#fff;
  text-decoration:underline;
  }
  
  .showpageNum a {
  text-decoration:none;
  border: 1px solid #000;
  background: url(https://lh5.googleusercontent.com/-uy6XIr1yxVM/Tns0EvOTRaI/AAAAAAAAAdE/GXt14V5Eu9Q/s288/navi1.jpg) top left repeat-x;
  margin:0 2px;
  padding:10px;
  }
  
  .showpageNum a:hover {
  background: url(https://lh4.googleusercontent.com/-pMFZexqE-8s/Tns0EwQ9TTI/AAAAAAAAAdI/O2dljR7h_vA/s288/navi2.jpg) top left repeat-x;
  }
  .showpagePoint {
  color:#fff;
  text-decoration:none;
  border: 1px solid #000;
  background: url(https://lh4.googleusercontent.com/-pMFZexqE-8s/Tns0EwQ9TTI/AAAAAAAAAdI/O2dljR7h_vA/s288/navi2.jpg) top left repeat-x;
  margin:0 3px;
  padding:10px;
  }
  .showpageOf {
  background: url(https://lh5.googleusercontent.com/-uy6XIr1yxVM/Tns0EvOTRaI/AAAAAAAAAdE/GXt14V5Eu9Q/s288/navi1.jpg) top left repeat-x;
  color:#fff;
  text-decoration:none;
  border: 1px solid #000;
  padding:10px;
  margin: 0 3px 0 0;
  }
  .showpage a {
  background: url(https://lh5.googleusercontent.com/-uy6XIr1yxVM/Tns0EvOTRaI/AAAAAAAAAdE/GXt14V5Eu9Q/s288/navi1.jpg) top left repeat-x;
  color:#fff;
  text-decoration:none;
  border: 1px solid #000;
  padding:10px;
  }
  .showpage a:hover {
  background: url(https://lh4.googleusercontent.com/-pMFZexqE-8s/Tns0EwQ9TTI/AAAAAAAAAdI/O2dljR7h_vA/s288/navi2.jpg) top left repeat-x;
  color:#fff;
  text-decoration:none;
  border: 1px solid #000;
  }
  .showpageNum a:link,.showpage a:link {
  text-decoration:none;
  color:#fff;
  }
  
  
• Selanjutnya Cari Kode Seperti ini </body> Dan Copy Kode Dibawah ini Dan Taruh Tepat Diatasnya Kode </body> Tersebut.
• yg berwarna merah jumlah artikel di halamanan, yg berwarna kuning banyaknya nomer yg ingin di munculkan.
  
  
  <b:if cond='data:blog.pageType != &quot;item&quot;'>
  <script type='text/javascript'>
  var pageCount=5;
  var displayPageNum=5;
  var upPageWord =&#39;Prev&#39;;
  var downPageWord =&#39;Next&#39;;
  </script>
  <script src='http://filiex.googlecode.com/files/pager-number.js' type='text/javascript'/>
  </b:if>
  
  
• Tahap Terakhir Sobat Cari Kode 'data:label.url' Dan Gantikan Atau Replace Kode Tersebut Dengan Kode Dibawah ini.
  
  
  'data:label.url + &quot;?&amp;max-results=5&quot;'
  
  
• Bila Semua Sudah Selesai Harap Di Pratinjau Dulu Dan Bila Page Number Sudah Muncul, Sekarang Sobat Bisa Save Atau Simpan Template Sobat.
• Selesai.

               Blogger Page Navigation Widget Generators With Styles

Here Is The Blogger Pagination Online Widget Generators List With Full Customization. So Come On First Discuss How It Will Effect On Blogging.

Page navigation widget for blogger is most popular widget, and almost all bloggers are using this. as these widgets are only provided in wordpress blogs or hosted blogs.But now his hack has been made available in bloggers also Here is I am giving this Page Navigation Widget with Different styles, and full Customization options.
Numbered Page Navigation Widget is a JavaScript hack for blogger to easily navigate blogger pages. In this post i am giving stylish navigation with different colorful styles.
Page Navigation is awesome widget which enables page number navigation to visitors. You might have seen numbered page navigation on many WordPress blogs. There is simple JavaScript which enables your older posts, newer posts & home links to numbers. Have you seen that older posts, newer posts & home links are boring feel.

Page Navigation is a really awesome and long awaited feature.  It really was an awesome trick which was made at a time when nobody could even think of implementing it on blogger. When you use this hack,you will see this kind of navigation on your blog’s home page and label pages (needs little customization).
Today we will see how to add a nice page number navigation hack blogger. The default navigation links (i.e Older Posts) is not the friendly visitor if you are having a lot of jobs and bloggers readers.Few has some problems with the above script navigation page. Now here is a completely new script and work for numbered page navigation (i.e. Panigation) for Blogger. The paging widget for blogger it easy for the visitor. It is a must have for any new blogs.This new script allows you to add numbered page navigation to blogger/ blogspot blog with page numbers starting(1, 2, 3, 4 ….) like those of a book.
One of the important features of a good blog or site is that it is very easy for the blog visitors to navigatethroughout the site. A site which is structured in such a way that the visitors have to take efforts to move from one page to another is seen as a poorly designed site. 

Colorful Blogger Numbered Pagenavigation Widget

Page Navigation Widget Generator

Blogger Page Navigation Widget Generator With Styles