Friday, October 5, 2012

Mengganti "Older Posts" Dengan Angka

 Lihatlah @ku - Apakah Anda bosan dengan blog Anda? Kali ini saya ingin memberikan sedikit cara untuk membuat blog Anda menjadi lebih menarik dan menghidupkan blog yang Anda miliki sekarang.

Seperti kita ketahui, secara umum bahawa navigasi untuk berpindah halaman biasanya hanya dengan sebuah kata yang bertuliskan "Older Posts" Atau "Previous". Namun apakah Anda telah mengetahui bahwa ada cara untuk mengubah itu semua dengan sebuah angka-angka sehingga blog Anda terlihat seperti profesional.

Anda pernah melihat bahwa di Google juga memiliki navigasi untuk berpindah halaman menggunakan sebuah angka, dan itu menurut pendapat saya akan lebih memudakhan kita dalam pencarian karena kita bisa memilih langsung halaman yang kita inginkan. Tidak seperti saat kita menggunakan navigasi halaman dengan sebuah kata "Older Posts", karena dengan itu kita hanya bisa berpindah halaman per halaman.

Ada beberapa tahap dan cara-cara yang harus dilakukan oleh Anda, diantaranya :

1. Masuklah ke akun blog yang Anda miliki.
2. Pilih Template --> Edit HTML --> Lanjutkan --> Centang "Expand Template Widget" (untuk tampilan blog baru).
3. Anda harus mencari sebuah kata atau kode ]></b:skin>. Tenang, Anda tidak perlu sudah-sudah mencarinya karena Anda bisa menggunakan "Ctrl+F" dan masukkan kata ]></b:skin> di atas.
4. Setelah ketemu maka langkah selanjutnya adalah memasukkan kode di bawah ini tepat sebelum/di atas kode 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;
}

5. Kemudian setelah terpasang maka Anda cari kode </body>, lalu taruh atau letakkan kode/script di bawah ini di atas kode </body>.

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&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://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>
<!--Page Navigation Ends -->

6. Klik "Save" dan selesai. Kalau sudah silahkan Anda lihat hasilnya. Kurang lebih hasilnya seperti ini :




Saat ini agan sedang membaca artikel Mengganti "Older Posts" Dengan Angka di blog Lihatlah @ku. Semoga artikel yang agan baca ini dapat bermanfaat. Jangan lupa BERKOMENTAR dengan baik di blog ini ya? :)

1 comment:

  1. Saya coba terapkan gan, trims ya. Ditunggu kunjungannya...

    ReplyDelete

Berkomentarlah dengan baik dan benar. Karena jika ada komentar yang mengandung SPAM, akan segera dihilangkan. Terima kasih :)