Mengganti "Older Posts" Dengan Angka

Bagi pengguna Web dengan platform Blogger, yang tentunya adalah Blogspot. pasti pada umumnya template default atau bawaan dari blogger biasanya menggunakan link dengan teks "Older Posts (posting lama)" dan "Newer Posts (posting baru)".

Tidak hanya pada template default, pada template-template free download pun masih ada yang menampilkan seperti itu.

dan sekarang kita akan coba membahas cara merubahnya menjadi seperti gambar dibawah ini :

Sebenarnya tampilan ini adalah tampilan yang biasa digunakan oleh pencarian Google. Pastinya dengan tampilan older post seperti gambar diatas akan membuat blog sobat menjadi tambah rapi dan semakin enak untuk dilihat.

Bagi sobat yang ingin menggunakannya, silahkan ikuti langkah-langkah dibawah :

1. Oke, kita langsung saja, setelah LOGIN ke blogger, langsung saja ke bagian Edit HTML
2. Setelah itu sobat cari kode ini ]]></b:skin> (gunakan CTRL + F untuk memudahkan pencarian)
3. Lalu letakkan Kode dibawah ini diatas kode ]]></b:skin> 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;
}

4. Setelah itu, sobat cari kode ini </body> kemudian letakkan kode dibawah ini, diatas 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 -->

4. Lalu Save template, dan lihat hasilnya...