Cara memberi halaman bernomor pada blog

Bismillah mari kita mulai pelajari cara memberi halaman bernomor pada blog :

catatan:

1. Jangan kasih judul buat widget sobat.
2. Angka 5 merupakan jumlah posting yang akan ditampilkan.
3. Yang warna merah adalah kode warna, silahkan sobat blogger sesuaikan.

 Nah ini langkah-langkahnya silahkan di cermati

• Sign In di blogger.com
• Pada Menu Drop Down klik Layout
• Klik Add a gadget dan pilih HTML/JavaScript.
• Copy Paste kode berikut pada kolom yang tersedia  

 <style type='text/css'>
#blog-pager{height: 28px;
    padding: 10px 0 0;
overflow:hidden;
text-align:center;
}
.showpageArea a {text-decoration:underline;
font-size: 16px;
       text-align: center;}
.showpageNum a {font-size:16px;text-decoration:none;border: 1px solid #cccccc;margin:0 5px;padding:5px;}
.showpageNum a:hover {border: 1px solid #cccccc;background-color:#cccccc;}
.showpagePoint {font-size:16px;text-decoration:none;border: 1px solid #cccccc;background: #216FD9;margin:0 5px;padding:5px;color:#ffffff;}
.showpageOf {text-decoration:none;padding:5px;margin: 0 5px;}
.showpage a {text-decoration:none;border: 1px solid #cccccc;padding:5px;}
.showpage a:hover {text-decoration:none;background: #cccccc;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;}</style>
<script style='text/javascript'>var pageCount=5;
var displayPageNum=5;var upPageWord="Previous";var downPageWord="Next";</script>
<script style='text/javascript' src='http://tutorialblogspot.googlecode.com/files/halamanblog.js'></script>
<p style="display:none;">Page Navigation by<a href="http://cerdas-berbagi.blogspot.com/" rel="dofollow">Tutorial Blogspot</a></p>

 setelah meng copy simpandan lihat hasilnya seperti dibawah