Pagenavi Angka di Gadget Blogger

Pagenavi Angka di Gadget Blogger dan banyak cara membuat tombol navigasi ganti halaman dengan angka di blogger antara lain menggunakan tambah gadget di kolom widget.

Cara ini juga mempermudah para blogger untuk mempermudah para pengunjung berselancar di situs blogspot anda.

Cara ini tidak begitu sulit hanya menambahkan di menu editor tata letak, ikuti step mudah ini.

1. Buka dasboard blogger anda.
2. Pilih menu tata letak /layout.
3. Tambah gadget yang terletak di bawah widget main wrapper.
4. Pilih javascript paste kode di bawah ini dan simpan.

<style type="text/css">
#blog-pager{clear:both;margin:30px auto;text-align:center;padding:7px}#blog-pager2{clear:both;text-align:center;padding:7px;overflow:hidden}.blog-pager{background:none}.displaypageNum a,.showpage a{padding:5px 10px;margin-right:5px;color:#fff;background-color:#2973fc;-webkit-box-shadow:0 5px 3px -1px rgba(50,50,50,0.53);-moz-box-shadow:0 5px 3px -1px rgba(50,50,50,0.53);box-shadow:0 5px 3px -1px rgba(50,50,50,0.53)}.pagecurrent{padding:5px 10px;margin-right:5px;-webkit-box-shadow:0 5px 3px -1px rgba(50,50,50,0.53);-moz-box-shadow:0 5px 3px -1px rgba(50,50,50,0.53);box-shadow:0 5px 3px -1px rgba(50,50,50,0.53)}.displaypageNum a:hover,.showpage a:hover{background:#000;text-decoration:none;color:#fff}.pagecurrent{background:#000;text-decoration:none}#blog-pager .showpage,#blog-pager,.pagecurrent{font-weight:bold;color:#fff}#blog-pager .pages{border:#2973fc;-webkit-box-shadow:0 5px 3px -1px rgba(50,50,50,0.53);-moz-box-shadow:0 5px 3px -1px rgba(50,50,50,0.53);box-shadow:0 5px 3px -1px rgba(50,50,50,0.53)}#blog-pager a{margin:0 5px 0 0;padding:2px 10px 3px;text-decoration:none;color:#fff;background:#2973fc;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;-webkit-transition:all .3s ease-in;-moz-transition:all .3s ease-in;-o-transition:all .3s ease-in;transition:all .3s ease-in}#blog-pager a:hover{color:#fff;text-decoration:none;background:#000}#blog-pager-older-link,#blog-pager-newer-link{float:none}
</style>
<script type="text/javascript">
var PageNavi_Blogger=PageNavi_Blogger||function(){function n(){var a=location.href;if(-1!=a.indexOf("/search/label/")){var c=-1==a.indexOf("?updated-max")?"?max":"?updated-max";b.postLabel=a.substring(a.indexOf("/search/label/")+14,a.indexOf(c))}-1==a.indexOf("?q=")&&-1==a.indexOf(".html")&&(b.currentPageNo=-1==a.indexOf("#PageNo=")?1:a.substring(a.indexOf("#PageNo=")+8,a.length),m(b.postLabel?"/feeds/posts/summary/-/"+b.postLabel+"?alt=json-in-script&callback=PageNavi_Blogger.callback.getTotalPostCount&max-results=1":
"/feeds/posts/summary?max-results=1&alt=json-in-script&callback=PageNavi_Blogger.callback.getTotalPostCount"))}function f(a,c){return'<span class="displaypageNum"><a href="#" onclick="PageNavi_Blogger.buttuns.redirect('+a+","+b.perPage+",'"+b.postLabel+"');return false">"+c+"</a></span>"}function l(a){return b.postLabel?'<span class="displaypageNum"><a href="/search/label/'+b.postLabel+"?max-results="+b.perPage+'">'+a+"</a></span>":'<span class="displaypageNum"><a href="/">'+a+"</a></span>"}function m(a){var b=
document.createElement("script");b.type="text/javascript";b.setAttribute("src",a);document.getElementsByTagName("head")[0].appendChild(b)}function p(a,c,e){var g=b.left_html.join(""),d=b.center_html.join(""),f=b.right_html.join(""),h;if(window.innerWidth>b.window_width||11>c||a>e-b.numPages)h=g+d+f;else if(c>=e-2&&(d+=f,f=null),h='<div style="text-align: center;line-height:2.2;">'+d+"</div>",g||f)h+='<div style="line-height:2.4;">',g&&(h+='<span style="text-align: left;float: left;">'+g+"</span>"),
f&&(h+='<span style="float: right;">'+f+"</span>"),h+="</div>";b.elements.forEach(function(b){b.innerHTML=h})}var k={defaults:{perPage:10,numPages:5,window_width:320},buttuns:{redirect:function(a){b.pageNo=a;"undefined"==b.postLabel&&(b.postLabel=!1);a=(b.pageNo-1)*b.perPage;m(b.postLabel?"/feeds/posts/summary/-/"+b.postLabel+"?start-index="+a+"&max-results=1&alt=json-in-script&callback=PageNavi_Blogger.callback.getURL":"/feeds/posts/summary?start-index="+a+"&max-results=1&alt=json-in-script&callback=PageNavi_Blogger.callback.getURL")}},
callback:{getURL:function(a){a=a.feed.entry[0];var c=encodeURIComponent(a.published.$t.substring(0,19)+a.published.$t.substring(23,29));a="/search/label/"+b.postLabel+"?updated-max="+c+"&max-results="+b.perPage+"#PageNo="+b.pageNo;c="/search?updated-max="+c+"&max-results="+b.perPage+"#PageNo="+b.pageNo;location.href=b.postLabel?a:c},getTotalPostCount:function(a){var c=parseInt(a.feed.openSearch$totalResults.$t,10),e=b.numPages,g=Math.floor(e/2);a=b.currentPageNo-g;1>a&&(a=1);c=Math.ceil(c/b.perPage);
e=a+e-1;e>c&&(e=c);1<a&&b.left_html.push(l(1));3==a&&b.left_html.push(f(2,2));if(3<a){var d=a-b.jumpPages+g;2>d?b.left_html.push(l("u00ab")):b.left_html.push(f(d,"u00ab"))}for(d=a;d<=e;d++)b.center_html.push(d==b.currentPageNo?'<span class="pagecurrent">'+d+"</span>":1==d?l(d):f(d,d));e==c-2&&b.right_html.push(f(c-1,c-1));e<c-2&&(g=e+1+g,g>c&&(g=c),b.right_html.push(f(g,"u00bb")));e<c&&b.right_html.push(f(c,c));p(a,e,c)}},all:function(a){a.forEach(function(a){(a=document.getElementById(a))&&b.elements.push(a)});
0<b.elements.length&&n()}},b={perPage:k.defaults.perPage,numPages:k.defaults.numPages,window_width:k.defaults.window_width,jumpPages:k.defaults.numPages,postLabel:null,pageNo:null,currentPageNo:null,elements:[],left_html:[],right_html:[],center_html:[]};return k}();
</script>
<script type="text/javascript">
PageNavi_Blogger.all(["blog-pager","blog-pager2"]);
</script>

Menambahkan kolom WIDGET di bawah postingan.
Semoga bermanfaat.