Cara membuat nomor halaman atau page navigator pada blogspot

Postingan default postingan blogspot tidak menyertakan nomor halaman atau sering disebut page navigator. Tetapi kalo tidak ada bukan tidak bisa, he….Kali ini sobatpc.com akan berbagi bagaimana cara membuat page navigator pada blogspot. Nomor halaman ini nantinya akan membuat pengunjung lebih mudah, karena bisa bernavigasi atau mengunjungi beberapa halaman yang diinginkan. Bagaimana cara membuat nomor halaman di blogspot ? Silahkan lanjutkan membaca artikel berikut

Caranyapun cukup mudah karena saya sudah upload JavaScripnya khusus buat anda jadi tidak perlu pusing-pusing ngelihat JavaScript yang ngejelimet karena tinggal copy paste gitu…hehe… saya yakin anda pasti bisa menerapkannya. untuk contohnya lihat gambar diatas atau pada blog ini dibagian bawah posting itu ada angka-angka dalam beberapa tombol kotak! itulah yang saya maksud dengan Navigasi halaman dengan angka!

1. Login ke blogger anda!
2. Masuk ke Dasboard>>Rancangan>> Edit HTML (tidak perlu memberikan klik pada Expand template widget)
3. Cari kode  ]]></b:skin> Kemudian Copy dan paste kode CSS berikut tepat diatas kode  ]]></b:skin>
   /* — NUMBER PAGE NAVIGATION — */
   .showpageNum a{font:15px Arial,Verdana;padding:4px 8px;margin:0 4px;text-decoration:none;border:0 solid #333;background:#dfdfdf;color:#686868;border:1px solid #989898}
   .showpageOf{margin:0 8px 0 0;color:#222;font:15px Arial,Verdana}
   .showpageNum a:hover{color:#494949;background:#dfdfdf;border:1px solid #626262}
   .showpageArea{margin:10px 0;font:15px Arial,Verdana;color:#111}
   .showpagePoint{color:#434343;font:bold 15px Arial,Verdana;padding:4px 8px;margin:2px;border:1px solid #b6b5b5;background:#fff;text-decoration:none}
4. Cari kode </body> kemudian Copy dan paste kode dibawah ini tepat diatas kode </body>
   <!– PAGE NAVIGATION START–>
   <script type=’text/javascript’>
   var pageCount=4;
   var displayPageNum=4;
   var upPageWord =&#39;&#171; &#39;;
   var downPageWord =&#39; &#187;&#39;;
   </script>
   <script src=’http://u-sup.googlecode.com/files/page_num.js’ type=’text/javascript’/>
   <!– PAGE NAVIGATION END–>
5. Klik SIMPAN TEMPLATE silahkan lihat hasilnya!

Catatan :
Perhatikan pada kode yang dicetak hijau itu dapat anda sesuaikan dengan keingin anda kode tersebutlah yang menentukan berapa jumlah posting yang akan ditampilkan pada setiap halamannya, contoh saya akan menampilkan 10 Posting  dan 5 tombol angka navigasi berarti kode saya sebagai berikut :

var pageCount=10;
var displayPageNum=5;

Dan untuk merubah Tampilan silahkan rubah kode CSSnya sesuai dengan selera anda, jika merasa tampilannya kurang cantik menurut anda!

Selamat mencoba, dan semoga berhasil membuat halaman navigasi dengan angka!!

 

 

sumber : http://u-sup.blogspot.com/2011/02/halaman-navigasi-dengan-angka.html