Membuat Navigasi Nomor Halaman

Bosan melihat tampilan navigasi halaman yang itu-itu saja ('posting lama-posting terdahulu-beranda') kali ini saya memberikan tips mengubah navigasi yang lawas tersebut. Meskipun navigasi tidak mempengaruhi SEO namun keberadaan navigasi memiliki banyak fungsi selain mempercantik halaman blog namun juga memepermudah pengunjung untuk mengakses postingan yang ada. Berikut merupakan salah satu cara mengubah tampilan halaman blog sobat :

  1. Login ke blogger  >> Rancangan >> Edit HTML >> beri tanda centang pada expand widget template
  2. Cari tag ]]></b:skin> 
  3. Copy lalu Paste kode CSS berikut diatas ]]></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;
    }

  4. Kemudian  cari  tag </body> 
  5. Copy kode berikut lalu Paste diatas tag </body>

<b:if cond='data:blog.pageType != &quot;item&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>  

  6. Save template dan lihat hasilnya.

Jika cara di atas tidak berhasil bisa saja template yang sobat gunakan tidak diijinkan menggunakan navigasi halaman.