Ruhendi.Com

“…Sepenggal Kisah Perjalanan Hidup & Kehidupan Seorang Manusia Biasa Bernama Heru”

Blogspot/ Blogger : ganti navigasi page number

Membuat Navigasi Page Number pada Blogspot untuk mengganti bawaannya yang umumnya menggunakan navigasi Previous dan Next pada bagian bawah, yang membantu pembaca untuk berganti halaman menuju tulisan sebelum atau setelah dari tulisan yang sedang dibaca tanpa ada keterangan nomor halaman.

Berikut adalah langkah-langkah membuat navigasi nomor halaman.

Pertama kita masuk menu Layout dan Edit HTML, jangan lupa Backup!! dulu template blog kita. Setelah kita backup, selanjutnya cari script berikut.
]]></b:skin>

Kemudian masukan script dibawah ini tepat di atas script yang kita cari tadi.

.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;
}

Script di atas adalah script Style (CSS), yang menentukan bentuk visual dari nomor halaman yang akan kita buat.

Selanjutnya kita cari script kedua yaitu seperti di bawah ini.
</body>

Kemudian masukan script berikut tepat di atas script tadi.

<b:if cond=’data:blog.pageType != “item”‘>
<script type=’text/javascript’>
var pageCount=5;
var displayPageNum=5;
var upPageWord =’Previous’;
var downPageWord =’Next’;
</script>
<script src=’http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js&#8217; type=’text/javascript’/>
</b:if>

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

Setelah itu kita simpan template kita.

Terakhir kita cari script berikut ini (jangan lupa untuk mengklik Expand Widget Templates-nya).
‘data:label.url’

Ganti script tersebut dengan script di bawah ini.
‘data:label.url + “?&max-results=5″‘

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).

Simpan template kita, dan kita coba lihat hasilnya dengan membuka blog kita. Jika berhasil maka pada halaman Home blog kita akan muncul nomor halaman setelah posting terakhir (paling bawah).

Selamat mencoba

Filed under: Internet, Tutorial,

3 Responses

  1. dwi isnein says:

    sob..coba dulu sebelum di posting…
    gak bisa tuh.
    ***

  2. ruhendi says:

    Semestinya bisa, coba cek http://heruruhendi.blogspot.com, ini juga pakai script itu. Bersabar, insyaalloh… He3

  3. Nuno says:

    Bener ga bisa, tidak well format

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: