Page Navigation Versi 2

Niat Ngeblog - Mengulas kembali dengan Page Navigation yang pernah kita bahas, kali ini kita akan membuat hal yang serupa tapi dengan tampilan berbeda. Tinggal kamu lebih suka menggunakan yang mana.

Ikuti langkah berikut ini, tapi sebelumnya jika di blog kamu sudah ada page navigation bisa kamu hapus dahulu kode sebelumnya.

01. Buka Account Blogger anda dan pilih menu Design.

02. Selanjutnya pilih Edit HTML dan jangan lupa untuk mengaktifkan kotak Expand Template Widget.

03. Latekkan kode ini tepat di atas ]]></b:skin>

.blog-pager,#blog-pager{ font-family:"Times New Roman", Times, serif; font-weight:normal; font-size:12px; width:500px;}.showpageNum a,.showpage a { background:transparent url('http://i1133.photobucket.com/albums/m596/abu-farhan/gbtn-bg.png') repeat-x; border:1px solid #97a7af; margin:0px 1px 0 1px;padding:3px 8px; text-decoration:none; color:#333;line-height:14px;cursor:pointer;white-space:nowrap; -webkit-border-radius:3px;-moz-border-radius:3px; }.showpageNum a:hover,.showpage a:hover { background-image:url('http://i1133.photobucket.com/albums/m596/abu-farhan/gbtn-bg-sel.png'); border:1px solid #e4905a;color:#e4905a;text-decoration:none; }.showpageOf{ margin:0 8px 0 0; }.showpagePoint { background:transparent url('http://i1133.photobucket.com/albums/m596/abu-farhan/gbtn-bg-sel.png') repeat-x; margin:0 3px 0 3px;padding:3px 8px; line-height:14px;cursor:pointer;white-space:nowrap; -webkit-border-radius:3px;-moz-border-radius:3px; border:1px solid #e4905a;color:#333;text-decoration:none;font-weight:bold; }

04. Lanjut, letakkan kode ini tepat di atas </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://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/></b:if></b:if><!--Page Navigation Ends -->

05. Save template dan lihat hasilnya.

Selamat mencoba,