Tutorial Membuat Navigasi Halaman Blogger- Tutorial Blogger Pemula

Tutorial cara membuat Navigasi Halaman pada template Blogger ini sebenarnya sudah banyak bertebaran, tetapi alangkah lebih baiknya kalau Tutorial cara membuat Navigasi Halaman pada template Blogger ini saya ulas kembali hanya sekedar pengingat agar saya pribadi tidak kesulitan mencari tutorialnya

1. Langkah Pertama

Taruh code CSS ini tepat berada diatas ]]></b:skin>

/* Page Navigation */

.pagenavi{clear:both;margin:10px auto;text-align:center}
.pagenavi span,.pagenavi a{padding:3px;margin-right:5px;background:#fff;border:1px solid #c20c0c}
.pagenavi a:visited{color:#c20c0c}
.pagenavi a:hover,.pagenavi .current{background:#c20c0c;color:#fff;text-decoration:none}
.pagenavi .pages,.pagenavi .current{font-weight:bold}
.pagenavi .pages{border:none}

2. Langkah Kedua

Taruh code dibawah ini

<b:includable id='page-navi'>
 <div class="pagenavi">
  <script type="text/javascript">
   var pageNaviConf = {
   perPage: 5,
   numPages: 9,
   firstText: "First",
   lastText: "Last",
   nextText: "Next",
   prevText: "Prev"
   }
  </script>
  <script type="text/javascript" src="http://rilwis.googlecode.com/svn/trunk/blogger/pagenavi.min.js"></script>
  <div class="clear" />
 </div>
</b:includable>

Tepat dibawah code...

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>

3. Langkah Ketiga

Cari code dibah ini dengan Ctrl+F didalam edit HTML Template

<b:include name='nextprev'/>

Dengan code berikut

<b:if cond='data:blog.pageType == "index"'>
 <b:include name='page-navi' />
 <b:else/>
 <b:if cond='data:blog.pageType == "archive"'>
  <b:include name='page-navi' />
 </b:if>
 <b:else/>
 <b:include name='nextprev'/>
</b:if>

Lalu sesuaikan pengaturan jumlah posting "perPage: 5" dengan jumlah pengaturan default template anda