Mengganti Navigasi Standar Blogger Dengan Tampilan Angka


Secara umum, navigasi untuk pindah halaman di blogger biasanya menggunakan link dengan teks "Older Posts (posting lama)" dan "Newer Posts (posting baru)". Beda dengan Wordpress yang navigasinya bisa berbentuk angka sehingga bisa memudahkan untuk loncat beberapa halaman ke postingan yg lama maupun baru.

Tutorial kali ini akan menjelaskan bagaimana cara mengganti link "Older Posts (posting lama)" dan "Newer Posts (posting baru)" menjadi angka seperti gambar di bawah ini :

Navigasi tampilan angka


Adapun langkah-langkahnya adalah sebagi berikut :
1. Langkah awal tentu saja harus menuju ke desain template anda kemudian ke "Edit HTML" 
2. Setelah itu cari kode ini ]]></b:skin> kalo sudah ketemu taruh script di bawah ini sebelum kode tersebut :

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


3. Kemudian cari kode ini </body> kemudian taruh script dibawah ini sebelum kode tersebut :

<!--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 -->

Simpan (save) dan lihat hasilnya, semoga bermanfaat.


Sumber : Mengganti "Older Posts" Dengan Angka - trik-tips.blogspot.com

2 Responses to "Mengganti Navigasi Standar Blogger Dengan Tampilan Angka"

  1. Glad to know that you enjoyed reading my post.
    Thank you for visiting Paul :)

    ReplyDelete
  2. Gan, ane mau tanya nih. Ane kan download template, lalu kok di navigasi angkanya hanya bisa ampe 150 postingan aja ya gan ? Padahal postingannya udah lebih dari 150. Misal, hanyan keliatan ampe halaman 30. Tapi sebenarnya masih ada banyak postingan setelah halaman itu. Tapi navigasi angkanya cuma bisa ampe 150 postingan. Maaf tanyanya muter2, hehe. Gimana cara ngatasinya ya gan ? Tolong di jawab yah.

    ReplyDelete