Page Navigation Blogger

Halaman navigasi untuk blogger adalah widget yang paling penting untuk blogger. Widget ini dapat membuat pengunjung mudah untuk menavigasi ke semua posting blog. Navigasi halaman pertama memiliki banyak bug, salah satunya adalah tidak dapat menunjukkan lebih dari 500 base pada link json dari blogger. Tapi Halaman Navi kali ini dapat menampilkan lebih dari 500 posting. Dan disini saya punya berbagai style

Page Nav Scroll

CSS :

/* Page Navigation--------------------- */.paginator {margin-top:60px;font-size:1em;}.paginator table {border-collapse:collapse;table-layout:fixed;width:100%;}.paginator table td {padding:0;white-space:nowrap;text-align:center;}.paginator span {display:block;padding:3px 0;color:#fff;}.paginator span strong,.paginator span a {padding:2px 6px;}.paginator span strong {background:#ff6c24;font-style:normal;font-weight:normal;}.paginator .scroll_bar {width:100%; height:20px;position:relative;margin-top:10px;}.paginator .scroll_trough {width:100%; height:3px;background:#ccc;overflow:hidden;}.paginator .scroll_thumb {position:absolute;z-index:2;width:0; height:3px;top:0; left:0;font-size:1px;background:#363636;}.paginator .scroll_knob {position:absolute;top:-5px; left:50%;margin-left:-10px;width:20px; height:20px;overflow:hidden;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRBcxAVOdZCH6KqomsBcA0xBaTu75Rpm0bE_9_hpFpTCkb2xUcPa0NQuV08W6c2nnxpVVlOnBQdGWyRgQsYSejuF8PDGFBKkfytKiIj1JWHbXBFZrsh48Ljj5S_87HLiHIy0O99ZJ909Q/s1600/slider_knob.gif) no-repeat 50% 50%;cursor:pointer; cursor:hand;}.paginator .current_page_mark {position:absolute;z-index:1;top:0; left:0;width:0; height:3px;overflow:hidden;background:#ff6c24;}.fullsize .scroll_thumb {display:none;}.paginator_pages {width:600px;text-align:right;font-size:0.8em;color:#808080;margin-top:-10px;}

JS :

<b:if cond='data:blog.pageType != &quot;item&quot;'><b:if cond='data:blog.pageType != &quot;static_page&quot;'><script src='http://donor-ilmu.googlecode.com/files/page_scroll.js' type='text/javascript'></script><script type='text/javascript'>var home_page=&quot;/&quot;;var urlactivepage=location.href;var postperpage=7;var numshowpage=6;</script><script src='http://donor-ilmu.googlecode.com/files/page_scroll_blogger.js' type='text/javascript'/></b:if></b:if>

Anda bisa merubah
Kode CSS (tidak perlu di rubah juga tidak masalah)
Kode JS pengaturan blog Anda:
var postPerPage = 7;
var numshowpage = 4;

postPerPage: Berapa banyak setiap Halaman Posting blog Anda
numshowpage: Banyak nomor akan ditampilkan dalam Navigasi Halaman Anda

Apakah anda sudah menetukan mana yang cocok di hati anda dari Page Nav di atas, Berikut cara memasangnya

1. Langka pertama yang akan anda lakukan adalah, Login di Blogger.com, pergi keTemplate > Edit HTML (Expand Widget Templates)
2. Tekan Ctrl+F cari kode ]]></b:skin>, letakan kode CSSnya di atas ]]></b:skin>
3. Berikutnya cari </body>, letakan kode JSnya di atas </body>
4. Terakhir cari kode 'data: label.url' (cari di semua teks dalam xml atau template anda) dan Ganti dengan ini

   'data: label.url + "? & max-results = 7"'

   Nilai 7 adalah berdasarkan berapa banyak posting yang akan ditampilkan di setiap halaman
5. Simpan Template, klik Save Template