Home » » Cara Membuat page previous 1,2,3,4,5 Next Di Blogspot

Cara Membuat page previous 1,2,3,4,5 Next Di Blogspot

Cara Membuat Navigasi Page Number Di Blogspot

Contoh Gambar :

Cara membuat Navigasi Page Number di blogspot atau cara membuat nomor pada bagian bawah posting untuk menuju ke halaman sebelumnya atau selanjutnya cara ini berfungsi untuk memudahkan pengunjung untuk melihat lihat setiap postingan pada blog anda dan tentunya akan lebih mantab ya khan? awalanya berbagai kode script yang saya coba kebanyakan tidak berhasil namun setelah google saya berhasil menemukan kode script yang sukses buat saya dan untuk itu saya akan memberikan kepada agan agan sekalian(kode script ini telah di modifikasi oleh Abu Farhan dan Muhammad Rias).

Baiklah Mari kita mulai sekarang :

1. Login ke blogger.

2. pilih dan klik Tata Letak dan pilih Edit HTML

3. Kalau sudah, klik Expand Template Widget

4. Lalu cari kode berikut (Ctrl + F) : ]]></b:skin>

5. Kemudian masukan kode script dibawah ini tepat di atas kode: ]]></b:skin> 

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

6. Selanjutnya kita cari lagi kode berikut: </body>

7. Kemudian masukan kode script berikut tepat di atas kode: </body> 
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>

Keterangan :
Kode pageCount di atas menunjukkan jumlah tulisan/posting/artikel yang akan ditampilkan dalam satu halaman.
Kode displayPageNum menunjukkan jumlah nomor halaman yang ditampilkan (jika diisi dengan angka 7 berarti nomor halaman yang muncul ada 8, ditambah satu untuk halaman satu).
Kode upPageWord mengarahkan kita ke halaman yang lebih baru (tulisan Previous bisa diganti sesuai dengan keinginan).
Kode downPageWord mengarahkan ke halaman yang lebih lama (tulisan Next bisa diganti sesuai dengan keinginan).

8. Terakhir kita cari kode script berikut: 'data:label.url'

9. Gantilah kode script diatas dengan kode dibawah ini:
'data:label.url + &quot;?&amp;max-results=5&quot;'    


Keterangan :
Fungsi dari script ini adalah untuk mengganti default (standar) Blogspot yang akan menampilkan 20 posting setiap halamannya, karena pada pageCount di atas kita isi 5, maka pada script ini pun juga diisi dengan 5 (menampilkan 5 posting per halaman).

10. Simpan template, dan lihat hasilnya.


Sumber

Jika anda berminta ke cara 2 dengan menambah Widget silahkan Klik Disini
Comments
2 Comments

2 komentar:

  1. BLOG nya keren bangen sobb,,, banyak informasinya ,, banyak ilmunya ,,, semoga makin banyak pengunjung ya sobb ,,, dannnnnn terus berbagi ilmu,,,

    BalasHapus

Silahkan berkomentar dengan menggunakan kata yang Sopan...
Trims...

Languange

English German Russian Japanese Arabic Chinese Simplified

Chat