Cara Membuat Unlimited Page Navigation [Update]


Unlimited Page Navigation - Template wajib memiliki Page Navigation yang memiliki fungsi kembali ke Postingan lama atau yang baru, page navigation ada yang memakai nomor ada juga yang tidak, keunggulan yang dimiliki page navigation dengan nomor yaitu pengunjung dapat mengetahui jumlah page dan dapat memudahkan pengunjung mengetahui blog tersebut memiliki konten yang banyak atau tidak.

Nah kali ini saya akan membagikan Unlimited Page Navigation yang cocok untuk blog dengan postingan diatas 1000 post. 

Ok kita mulai saja tutorial kali ini, silahkan perhatikan baik-baik dan jangan sampai ada yang terlewat.

  • Pertama Buka Blogger > Template > HTML, Lalu cari CSS Page navigation yang kalian punya dan ganti dengan CSS dibawah ini
  • /* blog-pager */
    #blog-pager{margin: 10px auto;text-align: left;overflow: visible;}
    #blog-pager a,.current{margin-bottom:4px;color:#333;display:inline-block;float:left;margin-right:3px;font-weight:400;font-size:14px;border:1px solid #ccc;padding:4px 10px}
    #blog-pager a:hover, .current:hover{border-color:#e65782;color:#e65782;}
    #blog-pager .pages{float:left;color:#333;border:1px solid #ccc;padding:5px 10px;margin-right:4px}
    

  • Kedua cari <div class='blog-pager' id='blog-pager'> sampai tutup </div> ganti bagian tengahnya saja, salin javascript ini dan ganti bagian tengah blog-pager kalian
  • <script type='text/javascript'>/*<![CDATA[*/
    var perPage=12,numPages=6,firstText="First",lastText="Last",prevText="<i class='fa fa-caret-left'></i>",nextText="<i class='fa fa-caret-right'></i>",urlactivepage=location.href,home_page="/";/*]]>*/</script><script type='text/javascript'>/*<![CDATA[*/
    eval(function(p,a,c,k,e,r){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--)r[e(c)]=k[c]||e(c);k=[function(e){return r[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}('C 1p(e){g a="";K=J(Y/2),K==Y-K&&(Y=2*K+1),E=d-K,E<1&&(E=1),b=J(e/h)+1,b-1==e/h&&(b-=1),H=E+Y-1,H>b&&(H=b),a+="<4 5=\'1M\'>1O "+d+" 1C "+b+"</4>";g t=J(d)-1;d>1&&(a+="i"==f?\'<4 5="1c 1b"><a 6="\'+z+\'">\'+X+"</a></4>":\'<4 5="7 1b"><a 6="/k/m/\'+x+"?&9-j="+h+\'">\'+X+"</a></4>"),d>2&&(a+=3==d?"i"==f?\'<4 5="1c"><a 6="\'+z+\'">\'+U+"</a></4>":\'<4 5="7"><a 6="/k/m/\'+x+"?&9-j="+h+\'">\'+U+"</a></4>":"i"==f?\'<4 5="7"><a 6="#" o="F(\'+t+\');u v">\'+U+"</a></4>":\'<4 5="7"><a 6="#" o="D(\'+t+\');u v">\'+U+"</a></4>"),E>1&&(a+="i"==f?\'<4 5="7"><a 6="\'+z+\'">1</a></4>\':\'<4 5="7"><a 6="/k/m/\'+x+"?&9-j="+h+\'">1</a></4>\');1a(g s=E;s<=H;s++)a+=d==s?\'<4 5="1y">\'+s+"</4>":1==s?"i"==f?\'<4 5="7"><a 6="\'+z+\'">1</a></4>\':\'<4 5="7"><a 6="/k/m/\'+x+"?&9-j="+h+\'">1</a></4>\':"i"==f?\'<4 5="7"><a 6="#" o="F(\'+s+\');u v">\'+s+"</a></4>":\'<4 5="7"><a 6="#" o="D(\'+s+\');u v">\'+s+"</a></4>";H<b&&(a+="i"==f?\'<4 5="7"><a 6="#" o="F(\'+b+\');u v">\'+b+"</a></4>":\'<4 5="7"><a 6="#" o="D(\'+b+\');u v">\'+b+"</a></4>");g r=J(d)+1;d<b-1&&(a+="i"==f?\'<4 5="7"><a 6="#" o="F(\'+r+\');u v">\'+17+"</a></4>":\'<4 5="7"><a 6="#" o="D(\'+r+\');u v">\'+17+"</a></4>"),d<b&&(a+="i"==f?\'<4 5="7 15"><a 6="#" o="F(\'+b+\');u v">\'+S+"</a></4>":\'<4 5="7 15"><a 6="#" o="D(\'+b+\');u v">\'+S+"</a></4>");1a(g p=A.1A("1z"),n=A.1w("1v-1E"),l=0;l<p.Z;l++)p[l].1d=a;p&&p.Z>0&&(a=""),n&&(n.1d=a)}C 11(e){g a=e.18,t=J(a.1B$1u.$t,10);1p(t)}C 1n(){g e=y;-1!=e.c("/k/m/")&&(x=-1!=e.c("?W-9")?e.B(e.c("/k/m/")+14,e.c("?W-9")):e.B(e.c("/k/m/")+14,e.c("?&9"))),-1==e.c("?q=")&&-1==e.c(".1t")&&(-1==e.c("/k/m/")?(f="i",d=-1!=y.c("#G=")?y.B(y.c("#G=")+8,y.Z):1,A.16(\'<w P="\'+z+\'O/M/T?9-j=1&Q=N-V-w&R=11"></w>\')):(f="m",-1==e.c("&9-j=")&&(h=1L),d=-1!=y.c("#G=")?y.B(y.c("#G=")+8,y.Z):1,A.16(\'<w P="\'+z+"O/M/T/-/"+x+\'?Q=N-V-w&R=11&9-j=1" ></w>\')))}C F(e){L=(e-1)*h,I=e;g a=A.1e("1f")[0],t=A.1g("w");t.1h="1i/1j",t.1k("P",z+"O/M/T?1l-1m="+L+"&9-j=1&Q=N-V-w&R=12"),a.1o(t)}C D(e){L=(e-1)*h,I=e;g a=A.1e("1f")[0],t=A.1g("w");t.1h="1i/1j",t.1k("P",z+"O/M/T/-/"+x+"?1l-1m="+L+"&9-j=1&Q=N-V-w&R=12"),a.1o(t)}C 12(e){13=e.18.1D[0];g a=13.1q.$t.B(0,19)+13.1q.$t.B(1F,1G),t=1H(a);1I("i"==f)g s="/k?W-9="+t+"&9-j="+h+"#G="+I;1J g s="/k/m/"+x+"?W-9="+t+"&9-j="+h+"#G="+I;1K.6=s}"1r"==1s X&&(X="1N"),"1r"==1s S&&(S="1x");g I,f,d,x;1n();',62,113,'||||span|class|href|displaypageNum||max||lastPageNo|indexOf|currentPageNo||currentPage|var|perPage|page|results|search||label||onclick||||||return|false|script|postLabel|urlactivepage|home_page|document|substring|function|redirectlabel|pageStart|redirectpage|PageNo|pageEnd|noPage|parseInt|pageNumber|jsonstart|posts|json|feeds|src|alt|callback|lastText|summary|prevText|in|updated|firstText|numPages|length||totalcountdata|finddatepost|post||lastpage|write|nextText|feed||for|firstpage|showpage|innerHTML|getElementsByTagName|head|createElement|type|text|javascript|setAttribute|start|index|pagecurrentg|appendChild|looppagecurrentg|published|undefined|typeof|html|totalResults|blog|getElementById|Last|current|pageArea|getElementsByName|openSearch|of|entry|pager|23|29|encodeURIComponent|if|else|location|20|pages|First|Page'.split('|'),0,{}))
    /*]]>*/</script>

  • Ketiga, cari HTML seperti ini
  • <b:includable id='main' var='top'>

  • Kemudian temukan kode ini dibawahnya
  • <!-- navigation -->
        <b:include name='nextprev'/>

  • Lalu Ganti kode di atas dengan kode di bawah ini, jika sudah save Templatenya
  • <!-- navigation -->
        <b:if cond='data:blog.pageType == &quot;index&quot;'>
            <b:include name='nextprev'/>
        <b:else/>
        <b:if cond='data:blog.pageType == &quot;archive&quot;'>
            <b:include name='nextprev'/>
        <b:else/>
            <b:if cond='data:blog.homepageUrl != data:blog.url'>
    <!-- navigation -->
    <b:include name='nextprev'/>
    </b:if>
        </b:if>
        </b:if>

    Penting!

    Unlimited Page Navigation tidak akan muncul di halaman label, maka dari itu silahkan TAMBAHKAN KODE &amp; di belakang tanda tanya (?),

    Contohnya Seperti ini:
    expr:href='data:label.url + "?&amp;max-results=5"'

    Atau yang seperti ini
    https://NAMABLOGKAMU.blogspot.com/search/label/LABELKAMU?&amp;max-results=5
    TagKeterangan
    var perPage=12 Ganti 12 Dengan jumlah post yang kalian inginkan
    numPages=6 Ganti 6 untuk menampilkan tulisan di Page Navigationnya

    Jika bingung silahkan beri komentar, saya rasa sekian dari tutorial kali ini terima kasih, Semoga bermanfaat.
    Baca Juga : Recent Post Auto With Tooltip & Snippet