Navigasi Halaman Bernomor di Blogger

Navigasi Halaman bernomor memfasilitasi pengunjung untuk mengeksplorasi blog kita dan melihat halaman per halaman. Sayangnya Blogger tidak memberikan navigasi halaman bernomor tersebut.





Untuk pengguna Wordpress mungkin sudah terbiasa dengan navigasi halaman bernomor. Untuk pengguna Blogger terpaksa harus bikin sendiri.

Are You Ready...... wkwkwkwk
Mari kita mencoba bersama - sama, dengan langkah - langkah sebagai berikut :

Pertama, Login ke Blogger sahabat dan masuk ke Edit HTML.

Kedua, Tanda Expand Widget Templates jangan dicentang, biarkan saja kosong.


Ketiga, Cari kode ]]></b:skin> kemudian COPY - PASTE Kode CSS ini tepat diatas kode ]]></b:skin> tersebut.

/* Page Navigation styles */
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #999;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd;
}
.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
border:1px solid #888;
background: #ccc;
}
.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #999;
background: #666;
text-decoration: none;
}

Keempat, Cari kode </body> lalu COPY - PASTE kode dibawah ini tepat diatas kode </body> tersebut.

<!--Page Navigation Starts-->
<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=4;
var numshowpage=6;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://kangismet.googlecode.com/files/kangismet-pagenav.js' type='text/javascript'/>
<!--Page Navigation Ends -->

Untuk mengkostumisasi tampilan ini perhatikan warna berikut :

• var postperpage=4;
  

  Menampilkan  banyaknya postingan per halaman

• var numshowpage=6;
  

  Menentukan jumlah nomor navigasi halaman tambahan yang akan ditampilkan pada halaman.

Bagaimana, tertarik untuk mencobanya.....!!!