Letak widget navigasi halaman

Widget navigasi halaman ini adalah alternatif bagi bagi recent posts,older post dan home .Terletak dibahagian bawah blog.Saya rasa cara ini lebih mudah sebab tidak perlu salin kod pada template,cuma letak kod pada add gadget sahaja.Kalau letak kat template ni,susah sedikit hendak mencari kod tempat dimana ia perlu diletakkan dan ada setengah tidak menepati dengan template yang ada.

Untuk membuatnya ikuti langkah langkah berikut:

1. Masuk ke akaun blogger Anda dan pergi ke Design> Page Element
2. kemudian klik pada Add a Gadget
3. kemudian pilih HTML/JavaScript

    4.  Pada widget HTML/Javascript tersebut masukkan kod berikut:

<!-- StylishPage Navigation Widget For Blogger By http://bloggertrix.com -->
<style type="text/css">
#blog-pager{padding:5px 0 !important;}
.showpageArea {font-weight: bold;margin:5px;}/* 24work.blogspot.com */
.showpageArea a {text-decoration:underline;color: #fff;}/* 24work.blogspot.com */
.showpageNum a, .showpage a {color: #fff;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px; margin:0 3px;padding:3px 5px; background: #3b679e; background: -moz-linear-gradient(top, #3b679e 0%, #2b88d9 50%, #207cca 51%, #7db9e8 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3b679e), color-stop(50%,#2b88d9), color-stop(51%,#207cca),  color-stop(100%,#7db9e8)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b679e', endColorstr='#7db9e8',GradientType=0 ); }/* 24work.blogspot.com */
.showpageNum a:hover, .showpage a:hover {border: 1px solid #ccc; background: #aebcbf; background: -moz-linear-gradient(top, #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#aebcbf), color-stop(50%,#6e7774), color-stop(51%,#0a0e0a), color-stop(100%,#0a0809)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebcbf', endColorstr='#0a0809',GradientType=0 ); }/* 24work.blogspot.com */
.showpagePoint {color: #aaaaaa;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px; margin:0 3px;padding:3px 5px; background: #e2e2e2; background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); }/* 24work.blogspot.com */
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}/* 24work.blogspot.com */
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}/* 24work.blogspot.com */
</style>

<script type='text/javascript'>
var home_page="/";
var urlactivepage=location.href;
var postperpage=5;
var numshowpage=3;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='https://sites.google.com/site/teknikbuatblog/tbb/teknikbuatblog.js' type='text/javascript'></script>
<!-- StylishPage Navigation Widget For Blogger By http://bloggertrix.com -->

5. Sesudah memasukkan kod tadi pada widget,klik dan seret widget HTML/Javascript tadi pada kedudukan dibawah blog post anda.

Sumber:bloggertrix.com