Cara Membuat Navigasi Halaman Dengan Angka

Mediasura - Pada kesempatan kali ini saya akan share bagaimana Cara Membuat Navigasi Halaman Dengan Angka. Sebetulnya saya sudah cari tutorial ini ke beberapa web / blog lain, namun hasilnya selalu nihil / tidak bisa diterapkan pada blog saya. Setelah habis beberapa page di google akhirnya saya menemukan cara dari blog milik ilmi dragneel yang bisa saya terapkan pada blog saya. berikut tutorial singkatnya.

1. Masuk ke blogger dashboard > template / tema > Edit HTML.
2. Cari kode ]]></b:skin>, copy dan pastekan kode CSS dibawah ini di atas kode ]]></b:skin>

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 14px;padding: 5px 12px;margin-right:5px; color: #666; background-color:#eee;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#359BED;text-decoration:none;color: #fff;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#359BED;}
.showpageOf{display:none!important}
#blog-pager .pages{border:none;}

3. Cari kode </body> copy dan pastekan kode CSS dibawah ini di atas kode </body>

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
/*<![CDATA[*/
    var perPage=7;
    var numPages=6;
    var firstText ='First';
    var lastText ='Last';
    var prevText ='« Previous';
    var nextText ='Next »';
    var urlactivepage=location.href;
    var home_page="/";
/*]]>*/
</script>
<script src="http://www.geocities.ws/usmankurniawan/pagenation.js"/>
</b:if>
</b:if>

4. Langkah terakhir SAVE TEMPLATE dan lihat hasilnya.

Note : Anda bisa mengubah kode ini sesuai keinginan anda

var perPage=7; (Jumlah postingan per halaman)
var numPages=6; (Jumlah panjang nomor halaman yang ditampilkan)

Advertisement advertise here