Bismillahirrahmanirrahim. Mengubah Navigasi Halaman Dengan Nomor. sebelum membahas tentang artikel kali ini, saya ingin mengucapkan syukur Alhamdullillah kepada Allah SWT, karena saat melalui ujian tadi saya dapat mengerjakannya dengan baik. Semoga saja saya dapat melewati ujian-ujian berikutnya dengan lancar dan tentu saja benar. Amin
Kembali ke topik kita, Pada update kali ini saya akan membahas tentang cara Mengubah Navigasi Halaman Dengan Nomor yang diciptakan oleh sang master blogger Abu Farhan. Tapi, apakah anda sudah tahu yang mana Halaman Navigasi itu? jika belum, coba anda lirik bagian bawah blog ini. lalu lihat ada teks dengan link bertuliskan "Posting Lama" dan "Posting Baru". Nah, sekarang kita akan Mengubah Navigasi Halaman Dengan Nomor seperti yang ada pada gambar diatas. sedangkan fungsi dari navigasi halaman adalah untuk mempermudah pengunjung untuk berkeliling dan bermain di blog kita.
Kembali ke topik kita, Pada update kali ini saya akan membahas tentang cara Mengubah Navigasi Halaman Dengan Nomor yang diciptakan oleh sang master blogger Abu Farhan. Tapi, apakah anda sudah tahu yang mana Halaman Navigasi itu? jika belum, coba anda lirik bagian bawah blog ini. lalu lihat ada teks dengan link bertuliskan "Posting Lama" dan "Posting Baru". Nah, sekarang kita akan Mengubah Navigasi Halaman Dengan Nomor seperti yang ada pada gambar diatas. sedangkan fungsi dari navigasi halaman adalah untuk mempermudah pengunjung untuk berkeliling dan bermain di blog kita.
Untuk melakukannya, silahkan melakukan langkah ini:
- Login ke blogger, pergi ke Rancangan > Edit HTML
- centang expand template widget (ingat untuk membackup template sebelum melakukan trik ini)
- Cari kode ]]></b:skin> (lebih mudah dengan menekan ctrl+f pada keyboard anda) dan letakkan kode dibawah ini di atas kode ]]></b:skin> tadi
.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;
} - Kemudian cari kode </body> dan letakkan kode dibawah ini di atas kode </body> tadi
<script type='text/javascript'>NB: Ganti kode berwarna merah dan biru diatas menjadi seperti dibawah ini
var home_page="/";
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
</script>
<script src='http://all-in-one-blogger-widget.googlecode.com/files/pagenaviv202-min.js' type='text/javascript'></script>
var postperpage=Jumlah
Post setiap halaman untuk blog Anda;
var numshowpage=jumlah nomor yang akan muncul pada halaman navigasi anda;
5. Kemudian Cari kode ini 'data:label.url' dan ganti dengan kode dibawah ini:
'data:label.url + "?&max-results=7"' NB: Ganti angka 7 dengan jumlah nomor yang akan muncul pada halaman navigasi anda
6. Simpan template anda dan lihat hasilnya...
Semoga sukses...