Membuat navigasi nomor halaman blog

Cara membuat navigasi nomor halaman blog ini memiliki ragam bentuk dan sudah banyak sobat bloger yang mempostingnya. kali ini BlogsManado hanya share salah satu dari beberapa navigasi nomor halaman blog, semoga bermanfaat buat sobat yang sedang mencari informasi ini. baik langkah pertama yang harus sobat lakukan yaitu

1. Login pada blog yang ingin sobat pasang navigasi tersebut
2. Menu template
3. Edit HTML
4. Lanjutkan
5. Centang bagian Expand Template Widget
6. Cari kode ]]></b:skin>
7. setelah menemukan kode tersebut silahkan copy/paste kode CSS dibawah ini tepat diatas kode yang berada di nomor 5 

/* ------ Navigasi nomor halaman ------------- */
.showpageArea {
  font-family:verdana,arial,helvetica;
  color: #000;
  font-size:11px;
  margin:10px;
  }
  
.showpageArea a {
  color: #000;
  text-shadow:0 1px 2px #fff;
    font-weight: 700;
  }
  
.showpageNum a {
  padding: 3px 8px;
  margin:0 4px;
  text-decoration: none;
  border:1px solid #999;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  background: #ddd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-pXrQwW-unQwX2aIjjEG6AsaZJf5K6pVjI3f2S79Qi2gaXIFE8KA4gJDc2tqfkuuy6_QWjsp0jEgNrNQzew679iOMWKr0G6poZzKvADa-wmYEAmjonsE90e2OymypjTmAP6SXDcfC9Ww/s1600/wp1.jpg) 0 -50px repeat-x;
  }
  
.showpageNum a:hover {
  border:1px solid #888;
  background: #ccc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-pXrQwW-unQwX2aIjjEG6AsaZJf5K6pVjI3f2S79Qi2gaXIFE8KA4gJDc2tqfkuuy6_QWjsp0jEgNrNQzew679iOMWKr0G6poZzKvADa-wmYEAmjonsE90e2OymypjTmAP6SXDcfC9Ww/s1600/wp1.jpg) 0 -25px repeat-x;
  }

.showpageOf{
  margin:0 8px 0 0;
  }

.showpagePoint {
  color:#fff;
  text-shadow:0 1px 2px #333;
  padding: 3px 8px;
  margin: 2px;
  font-weight: 700;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  border:1px solid #999;
  background: #666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-pXrQwW-unQwX2aIjjEG6AsaZJf5K6pVjI3f2S79Qi2gaXIFE8KA4gJDc2tqfkuuy6_QWjsp0jEgNrNQzew679iOMWKr0G6poZzKvADa-wmYEAmjonsE90e2OymypjTmAP6SXDcfC9Ww/s1600/wp1.jpg) 0 0 repeat-x;
  text-decoration: none;
  }

Nah untuk memanggil kode CSS yang diatas, lanjutkan masih pada Edit HTML yang tadi

1. Cari kembali kode </body>
2. setelah ketemu kode tersebut, Copy/Paste kode yang dibawah ini tepat diatas kode </body>

123456789<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=5;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
</script>
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/pagenaviv202-min.js' 

1type='text/javascript'></script>

         atau bila kode yang diatas tidak bisa, coba dengan kode yang dibawah ini

123456789<script type='text/javascript'>//<![CDATA[
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=5;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
//]]></script>
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/pagenaviv202-min.js' 

1type='text/javascript'></script>

3. Cari kembali kode 'data:label.url'
4. Jika sudah ketemu silahkan ganti kode tersebut dengan kode yang dibawah ini

1'data:label.url + "?&max-results=10"'

5. Save & Selesai 

Keterangan...