Membuat Penomoran Pada Halaman Blog

Membuat Navigasi Halaman Berupa Angka - Untuk blogger, biasanya link navigasi halaman ini berupa link POSTING LEBIH BARU atau POSTING LAMA. Yang menjadi masalah dari sistem navigasi seperti ini, pengunjung blog

hanya bisa berpindah halaman demi halaman. Ini bisa diatasi dengan membuat navigasi angka yang bisa menampilkan beberapa halaman sekaligus.

Ini adalah salah satu widget yang mulai banyak digunakan. Jika anda tertarik untuk memasang navigasi angka seperti ini, maka ikuti prosedur sederhana berikut ini. Tapi untuk keamanan blog anda sebaiknya backup dulu template anda.

METODE  EXTERNAL SCRIPT

• Pertama Buka Tamplete lalu edit
• Cari kode </head>
• Taruh kode berikut tepat di atas </head>

<!--pengaturan tampilan-->
<style type='text/css'>
.showpageArea {
padding: 0 2px;
margin-top:50px;
margin-bottom:5px;
}
.showpageArea a {
color: #000000;
font-weight:normal;
background:#fff;
padding: 3px 6px !important;
font-size:11px;
margin:0px 2px;
text-decoration:
none;-moz-border-radius:5px;
}

.showpageNum a {
font-weight:normal;
font-size:11px;
padding: 3px 6px !important;
margin:0px 2px;
text-decoration: none;
-moz-border-radius:5px;
}
.showpagePoint {
font-size:11px;
-moz-border-radius:5px;
padding: 2px 5px 2px 5px;
margin: 2px;
font-weight: bold;
}
.showpage {
font-size:11px;
-moz-border-radius:5px;
}
.showpage a:hover {
font-size:11px;
}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
}
.showpageNum a:hover {
font-size:11px;
font-weight:normal;
}
.showpage a:hover {
color: #FFFFFF;
background-color: #3d85c6;
}
.showpagePoint {
color: #FFFFFF;
background: #3d85c6;
border: 1px solid #3d85c6;
}
.showpageNum a:link,.showpage a:link {
color: #000000 !important;
background-color: #3d85c6;
border: 1px solid #3d85c6;
}
.showpageNum a:hover {
color: #FFFFFF !important;
background: #3d85c6 !important;
border: 1px solid #3d85c6;
}
.showpageArea a {
border: 1px solid #3d85c6;
}
.showpageArea a:hover {
border: 1px solid #3d85c6;
color: #FFFFFF !important;
background: #3d85c6 !important;
}
</style>
<!--akhir pengaturan tampilan-->

• Kode #3d85c6 adalah untuk biru muda. Silahkan diganti sesuka anda
• Cari kode </body> dan taruh kode di bawah tepat di atasnya

<!--navigasi halaman mulai dari sini-->
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://rickynavigation.googlecode.com/files/rickynavigation.js' type='text/javascript'/>
<script src='http://rickynavigation.googlecode.com/files/rickynavigation2.js' type='text/javascript'/>
<!--akhir dari navigasi halaman-->

• var pageCount=5; adalah jumlah posting per halaman
• var displayPageNum=5; adalah jumlah tombol pada sisi kiri sebelum menambah tombol baru
• Simpan Perubahan Template anda....
• Masuk ke menu SETELAN dan pilih POS DAN KOMENTAR
• Atur agar jumlah postingan pada halaman utama sama dengan  nilai var pageCount
• Simpan Setelan (lihat gambar dibawah)

                                      

Berita Terkait

Cara Membuat Artikel Terkait Dibawah Posting Ivan Setyawan

Artikel Terkait