Cara Mengganti Navigasi Older Posts & Newer Posts Dengan Angka

Untuk para pengguna blogger, pastinya kalian tau kalo umumnya navigasi yang digunakan untuk pindah halaman di blogspot menggunakan link dengan teks Older Posts (posting lama) & Newer Posts (posting terbaru). Saat kita ingin mencari postingan yang sudah lama, Terkadang kita merasa risih untuk nge klik older posts nya. Well..itu juga ngabisin waktu kita, masa' untuk nyari 1 posting aja kita harus ngeklik berulang kali link older postsnya.  Beda dengan dengan wordpress yang navigasinya berupa angka sehingga memudahkan kita untuk loncat beberapa halaman ke postingan yang lama ataupun baru.

Okay, berikut tutorialnya :)

1. Buka Desain template -> Edit HTML 

2. Setelah Edit HTML nya dibuka, cari kode ]]></b:skin> (dengan cara menekan tombol Ctrl+F / F3)  copy script di bawah ini kemudian paste tepat diatas kode ]]></b:skin>

 .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. Cari kode </body> kemudian copy script di bawah ini dan paste sebelum 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. Klik Save Template. 

You're done! Silahkan lihat hasilnya :)