Page Navigation With (Next/Prev) For Blogger

By default Blogger has a simple navigation system to navigate between the posts and pages. This page navigation has just three buttons, one for next one for previous and one for home. this simple page navigation system is best to navigate between the posts but on pages and on post summary pages it does not seems good to work. For example if a visitor has to jump on directly to next to second page then he or she has to go through all the posts by using previous button.

To overcome this problem, there are many beautiful and handy page navigation widgets are available in Blogger world. These page navigation widgets have different styles and way of working. Using these widgets any one can make his or her blog awesome and user friendly.

The page navigation widget we have shared below is a very basic page navigation that has only next and previous page buttons and directly to any page no option. Usually page navigation widgets have backlink to their developers and they have their main JavaScript code hosted on remote sites. Since the remote hosting often remains down, resulting in the stoppage of the page navigation widget to work properly. Our page navigation widget has no such problem with it. We didn’t host any code anywhere. all is here so no tention of be down any time.

This page navigation is also limited to Home/Lable page oinly and on post page, blogger default page navigation will be back. So you have seen the screenshoot above so now the code is below. So now before procedding to the code, have a look on our navigation widget features list and then garb the code. Its very easy to install it without editing your template that can be dangerious sometime.

Features:

1.) PageNavigation With Next And Previous Button.
2.) Fully Customizable CSS.
3.) Easy To Install.
4.) Simple And Cross-Browser.
5.) Complete InBuilt Code, No Need To Edit Your Template.
6.) Pure JavaScript Code.
7.) Navigation Will Be Displayed Only On HomePage/LablePage.
8.) Next Post, Previous Post And Home Default Button Will Be Displayed On Post Page.
9.) No External Link Added.
10.) CSS3 Added For Style.
11.) First And Last Page Button Will Be Keep Showing.
12.) Withh Not Conflict With Any Code.

How To Add In Blogspot?

1.) Go To Your www.blogger.com
2.) Open Your Desire “Blog“.
3.) Go To “Layout“.
4.) Click “Add A Gadget” Where You Want To Add It.
5.) Now Scroll To “HTML-JAVASCRIPT“
6.) Click “+” Icon To Add It.
7.) Now “Copy” The Below Code And “Paste” It To There.
8.) Leave The Title Empty.
9.) Click “Save“.
10.) Move That Gadget Below “Blog1” Gadget. Now You Are Done.

<style type="text/css">
#blog-pager {
padding: 5px 0 !important;
}
.exeSHOWactivePAGE {
background:#fff !important;
cursor: no-drop;
}
.exeSHOWpageNO, .exeSHOWpageCOUNT, .exeSHOWactivePAGE {
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf));
background:-moz-linear-gradient(top, #ededed 5%, #dfdfdf100%);
background:-webkit-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
background:-o-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
background:-ms-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf',GradientType=0);
background-color:#ededed;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
border:1px solid #dcdcdc;
display:inline-block;
color:#777777;
font-family:Arial;
font-size:15px;
font-weight:bold;
padding:6px 12px;
text-decoration:none;
margin-left: 5px;
}
.exeSHOWpageNO:hover, .exeSHOWpageCOUNT:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed));
background:-moz-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
background:-webkit-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
background:-o-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
background:-ms-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
background:linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed',GradientType=0);
background-color:#dfdfdf;
}
.exeSHOWpageNO a, .exeSHOWpageCOUNT a {
color:#777777;
}
</style>
<script type='text/javascript'>
var exe_post_per_page = 4;
var exe_page_num_count = 1;
var exe_show_prev_page = 'Previous';
var exe_show_next_page = 'Next';
</script>
<script type='text/javascript'>
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('b'+e(c)+'b','g'),k[c])}}return p}('u a=["n","vfbE","","icsb","yeicmokgceeljbzb1b1eL1licsbXLjxycovfbElj","jx","yncxyneicmx","yeicmokgceeljbzb1b1eL1licsbXLjxycovfbEljnebcfkvngcCbgn","NMrczBfbeDgdel","yeicmokgceeljbzb1b1eL1licsbXLjxycovfbElj1GjoAmkghkYljfbqhfbkdicsb1Y","2s1HofbdDfmoEcgebjx","yeicmokgceeljbzb1b1eL1licsbXLjxycovfbElj1GjoAmkghkYljfbqhfbkdgcCbg1Y","jx1hyncxyneicmx","oJJJo","yeicmokgceeljbzb1b1eL1lckdh1ob1L1w2xZjx","yneicmx","JJJ","yqh1oxycovfbEljvddi1snn1k1k1kJbzbhqbceJkArjodhdgbljZ2pZ2gqbcejoEgAcd1sofhsvd1Hoicqqhms1so2miz1Hojodcfsbdlj2MCgcmYjxyhrsoCAfqbflj2Hjoefkljvddi1snnhrs1hJCgAsCgAsJkArnhrsnCgcmYJshEjo1khqdvlj2jjovbhsvdlj2jjonxyncxynqh1ox","icsb1wfbc","sbdZgbrbmde1BVXcrb","CgAsBicsbf","sbdZgbrbmd1BV2gq","gbmsdv","hmmbf1e1J2K2y","Ebbq","Aibm1bbcfkv1IdAdcg2nbeDgde","nebcfkvngcCbgn","hmqbzLE","NDiqcdbqBrcz","eDCedfhms","NMrcz","N2rl","Jvdrg","1G1LcsbXAl","yekfhidoefklj","EbbqeniAedeneDrrcfVNrczBfbeDgdel1hMcgdl1teAmBhmBekfhidMkcggCckYlcfhdvrcdhk1Kcdcjxynekfhidx","1kfhdb","gcCbg","MrczBfbeDgdel","EbbqeniAedeneDrrcfVnBn","Ncgdl1teAmBhmBekfhidMkcggCckYlcfhdvrcdhk1KcdcMrczBfbeDgdel1hjoxynekfhidx","vbcq","sbdZgbrbmde1BV1JcsXcrb","ekfhid","kfbcdbZgbrbmd","dVib","dbzdn1tc1ocekfhid","efk","EbbqeniAedeneDrrcfVNedcfdBhmqbzl","MrczBfbeDgdel1hMcgdl1teAmBhmBekfhidMkcggCckYlEhmqqcdbiAed","ebd1wddfhCDdb","ciibmq2ovhgq","NedcfdBhmqbzl","bmdfV","1Id","iDCghevbq","nebcfkvNDiqcdbqBrczl","NDiqcdbqBrczl"];u U=a[0];u Q=1Z[a[1]];u 1g;u K;u I;u R;1M();1d 2l(1A){u w=a[2];1i=1j(1r/2);p(1i==1r-1i){1r=1i*2+1};W=I-1i;p(W<1){W=1};H=1j(1A/O)+1;p(H-1==1A/O){H=H-1};1c=W+1r-1;p(1c>H){1c=H};u 1E=1j(I)-1;p(I>1){p(I==2){p(K==a[3]){w+=a[4]+U+a[5]+1u+a[6]}F{w+=a[7]+R+a[8]+O+a[5]+1u+a[6]}}F{p(K==a[3]){w+=a[9]+1E+a[10]+1u+a[6]}F{w+=a[11]+1E+a[10]+1u+a[6]}}};p(W>1){p(K==a[3]){w+=a[4]+U+a[12]}F{w+=a[7]+R+a[8]+O+a[12]}};p(W>2){w+=a[13]};2k(u P=W;P<=1c;P++){p(I==P){w+=a[14]+P+a[15]}F{p(P==1){p(K==a[3]){w+=a[4]+U+a[12]}F{w+=a[7]+R+a[8]+O+a[12]}}F{p(K==a[3]){w+=a[9]+P+a[10]+P+a[6]}F{w+=a[11]+P+a[10]+P+a[6]}}}};p(1c<H-1){w+=a[16]};p(1c<H){p(K==a[3]){w+=a[9]+H+a[10]+H+a[6]}F{w+=a[11]+H+a[10]+H+a[6]}};u 1D=1j(I)+1;p(I<H){p(K==a[3]){w+=a[9]+1D+a[10]+1U+a[6]}F{w+=a[11]+1D+a[10]+1U+a[6]}};w+=a[17];u 1m=S[a[19]](a[18]);u 1x=S[a[21]](a[20]);2k(u 1n=0;1n<1m[a[22]];1n++){1m[1n][a[23]]=w};p(1m&&1m[a[22]]>0){w=a[2]};p(1x){1x[a[23]]=w}};1d 2q(1q){u 2i=1q[a[24]];u 2h=1j(2i[a[25]].$t,10);2l(2h)};1d 1M(){u G=Q;p(G[a[27]](a[26])!=-1){p(G[a[27]](a[28])!=-1){R=G[a[29]](G[a[27]](a[26])+14,G[a[27]](a[28]))}F{R=G[a[29]](G[a[27]](a[26])+14,G[a[27]](a[2L]))}};p(G[a[27]](a[2G])==-1&&G[a[27]](a[2F])==-1){p(G[a[27]](a[26])==-1){K=a[3];p(Q[a[27]](a[1f])!=-1){I=Q[a[29]](Q[a[27]](a[1f])+8,Q[a[22]])}F{I=1};S[a[2e]](a[1S]+U+a[2A])}F{K=a[2z];p(G[a[27]](a[1F])==-1){O=20};p(Q[a[27]](a[1f])!=-1){I=Q[a[29]](Q[a[27]](a[1f])+8,Q[a[22]])}F{I=1};S[a[2e]](a[1S]+U+a[1W]+R+a[2D])}}};1d 2E(1a){1p=(1a-1)*O;1g=1a;u 1v=S[a[1T]](a[2f])[0];u T=S[a[1R]](a[1Q]);T[a[1N]]=a[1O];T[a[1P]](a[1V],U+a[2C]+1p+a[2c]);1v[a[2d]](T)};1d 2B(1a){1p=(1a-1)*O;1g=1a;u 1v=S[a[1T]](a[2f])[0];u T=S[a[1R]](a[1Q]);T[a[1N]]=a[1O];T[a[1P]](a[1V],U+a[1W]+R+a[2J]+1p+a[2c]);1v[a[2d]](T)};1d 2I(1q){1C=1q[a[24]][a[2w]][0];u 1X=1C[a[2b]][a[2a]][a[29]](0,19)+1C[a[2b]][a[2a]][a[29]](23,29);u 1z=2v(1X);p(K==a[3]){u 1y=a[2u]+1z+a[1F]+O+a[1f]+1g}F{u 1y=a[26]+R+a[2t]+1z+a[1F]+O+a[1f]+1g};1Z[a[1]]=1y};',62,173,'||||||||||_0x9492|x65|x61|x74|x73|x72|x6C|x69|x70|x22|x63|x3D|x6E|x2F|x20|if|x64|x6D|x67||var|x68|_0xad9ax9|x3E|x3C|x78|x6F|x2D|x62|x75|x66|else|_0xad9ax15|maximum|itemNumber|x2E|type|x4F|x26|x3F|exe_post_per_page|_0xad9axb|exe_url_active_page|lblname1|document|_0xad9ax19|exe_home_page|x79|start|x4E|x6B|x45|||||||||||_0xad9ax17|x53|end|function|x48|33|nopage|x31|numberLeft|parseInt|x77|x57|_0xad9axd|_0xad9axf|x76|jsonstart|_0xad9ax11|exe_page_num_count|x3A|x6A|exe_show_prev_page|_0xad9ax18|x41|_0xad9axe|_0xad9ax1e|_0xad9ax1d|_0xad9ax8|x42|post|_0xad9axc|_0xad9axa|38|x23|x3B|x24|x54|x44|x50|bloggerPage|45|46|50|43|44|34|42|exe_show_next_page|47|39|_0xad9ax1c|x28|location|||||||||||54|55|49|51|36|41|x49|_0xad9ax13|_0xad9ax12|x33|for|loopPage|x32|x52|x43|x58|arithmaticData|x71|x29|57|56|encodeURIComponent|53|x47|x4C|37|35|redirectlabel|48|40|redirectpage|32|31|x30|finddatepost|52|x4D|30|x5F'.split('|'),0,{}))</script>