Tutorial Membuat Navigasi Angka di Bawah Posting Blog

Membuat Navigasi Angka di Bawah Posting Blog - Masih tentang Tutorial blog, kali ini Andi Techno akan berbagi Tutorial Membuat Navigasi Angka di Bawah Posting Blog, Bagaimanakah Navigasi angka itu? ihat gambar berikut ini:

oke ayo kita praktekkan bagaimana cara Membuat Navigasi Angka di Bawah Posting Blog

1. Masuk ke Dashboard Blogger kamu > Klik Rancangan > Edit HTML > centang Expand Template Widget
2. Cari kode ]]></b:skin> dengan bantuan Ctrl+F lalu letakkan kode dibawah ini tepat diatas kode ]]></b:skin> tadi

/* -- NAVIGASI DENGAN ANGKA -- */.totalpages{color:#333; padding-right:7px;}.showpageArea a{text-decoration:none;}.showpageNum a{padding:4px 8px;margin:0 4px;text-decoration:none;color:#000;text-shadow:#fff 1px 1px 1px;border:1px solid #CDCDCD;background:#DADBDB url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbzU2-7zWnHC6G6ZBVPZ8eKv84A_BwHd9F-vwh2lYEG9x9FxZ4HkKgqS5gYb8B-1_bLtH8t1sRJte4cbpO1S3Pm-8OTQxXH7oJQdLOZTP1PyWvqgwAi0LLA7GuaS52F-pZOoV18wH7c3G_/s1600/off.png') repeat-x ;-moz-border-radius:4px;-khtml-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}.showpageNum a:hover{ color:#000;text-shadow:#fff 1px 1px 1px; border:1px solid #CDCDCD; background:#C4C4C4 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgikeROaQr50uaGd4NQsNv0KzoXBJblosCRsTWeD4X2sVewnGi9fqRcx1qLMGxJlFkkPoWCIv-EYxGqkaTdc_Z3mSZ8ojqQPrM35xWjVfKciN7R20miiAPGDgKm3wMVqR03R4KjipI0pYue/s104/pghover.png') repeat-x ;}.showpagePoint{color:#333;text-shadow:#fff 1px 1px 1px;padding:4px 8px;margin:2px;font-weight:bold;border:1px solid #cccccc;background:#959494 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh6TDkEKCsn32EhS0xFRt3JZdJTBQxvWjP56pJtwSyGCGKwxqMhHABbuorbFvuOFw5MFGFdJOI2erS3c2NSl8rzXV8rUiM3R_ElWSqFrre5I44JmsUwRLBZcAOiQYBTo_D9l_1Dfq7zI00/s1600/pgoff.png') repeat-x ;text-decoration:none;-moz-border-radius:4px;-khtml-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;}.showpageOf{margin:0 8px 0 0; padding:4px 8px; color:#333;text-shadow:#fff 1px 1px 1px; background:#DADBDB url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbzU2-7zWnHC6G6ZBVPZ8eKv84A_BwHd9F-vwh2lYEG9x9FxZ4HkKgqS5gYb8B-1_bLtH8t1sRJte4cbpO1S3Pm-8OTQxXH7oJQdLOZTP1PyWvqgwAi0LLA7GuaS52F-pZOoV18wH7c3G_/s1600/off.png') repeat-x ;-moz-border-radius:4px;-khtml-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;}.showpage a{padding:1px 8px; color:#333;text-shadow:#fff 1px 1px 1px;margin:0 2px;text-decoration:none;border:1px solid #CCC;background:#DADBDB url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbzU2-7zWnHC6G6ZBVPZ8eKv84A_BwHd9F-vwh2lYEG9x9FxZ4HkKgqS5gYb8B-1_bLtH8t1sRJte4cbpO1S3Pm-8OTQxXH7oJQdLOZTP1PyWvqgwAi0LLA7GuaS52F-pZOoV18wH7c3G_/s1600/off.png') repeat-x ;-moz-border-radius:4px;-khtml-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}.showpage a:hover{color:#000;text-shadow:#fff 1px 1px 1px;padding:4px 8px;margin:2px;font-weight:bold;border:1px solid #CDCDCD;background:#C4C4C4 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgikeROaQr50uaGd4NQsNv0KzoXBJblosCRsTWeD4X2sVewnGi9fqRcx1qLMGxJlFkkPoWCIv-EYxGqkaTdc_Z3mSZ8ojqQPrM35xWjVfKciN7R20miiAPGDgKm3wMVqR03R4KjipI0pYue/s104/pghover.png') repeat-x ;}text-decoration:none;-moz-border-radius:4px;-khtml-border-radius:4px;-webkit-border-radius:4px; border-radius:4px}.showpageNum a:link, .showpage a:link{text-decoration:none; color:#333}/* -- NAVIGASI DENGAN ANGKA -- */

3. Lalu cari kode </body> dan letakkan kode dibawah ini tepat diatas kode </body> tadi

 <!-- awal navigasi angka andi-techno.blogspot.com --><script type='text/javascript'>var home_page="/";var urlactivepage=location.href;var postperpage=6;var numshowpage=5;var upPageWord ='&#9668;';var downPageWord ='&#9658;';</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}('5 G;5 i;5 b;5 n;1f();x 1g(15){5 6=\'\';H=I(K/2);3(H==K-H){K=H*2+1}J=b-H;3(J<1)J=1;o=I(15/j)+1;3(o-1==15/j)o=o-1;L=J+K-1;3(L>o)L=o;6+="<4 e=\'1y\'>1z "+b+\' 1A \'+o+"</4>";5 16=I(b)-1;3(b>1){3(b==2){3(i=="w"){6+=\'<4 e="1B"><a f="\'+y+\'">\'+M+\'</a></4>\'}c{6+=\'<4 e="k"><a f="/r/s/\'+n+\'?&7-l=\'+j+\'">\'+M+\'</a></4>\'}}c{3(i=="w"){6+=\'<4 e="k"><a f="#" z="N(\'+16+\');A B">\'+M+\'</a></4>\'}c{6+=\'<4 e="k"><a f="#" z="O(\'+16+\');A B">\'+M+\'</a></4>\'}}}1h(5 g=J;g<=L;g++){3(b==g){6+=\'<4 e="1C">\'+g+\'</4>\'}c 3(g==1){3(i=="w"){6+=\'<4 e="k"><a f="\'+y+\'">1</a></4>\'}c{6+=\'<4 e="k"><a f="/r/s/\'+n+\'?&7-l=\'+j+\'">1</a></4>\'}}c{3(i=="w"){6+=\'<4 e="k"><a f="#" z="N(\'+g+\');A B">\'+g+\'</a></4>\'}c{6+=\'<4 e="k"><a f="#" z="O(\'+g+\');A B">\'+g+\'</a></4>\'}}}5 17=I(b)+1;3(b<o){3(i=="w"){6+=\'<4 e="k"><a f="#" z="N(\'+17+\');A B">\'+1i+\'</a></4>\'}c{6+=\'<4 e="k"><a f="#" z="O(\'+17+\');A B">\'+1i+\'</a></4>\'}}5 C=u.1D("C");5 18=u.1E("1F-1G");1h(5 p=0;p<C.P;p++){C[p].1j=6}3(C&&C.P>0){6=\'\'}3(18){18.1j=6}}x 1a(Q){5 R=Q.R;5 1k=I(R.1H$1I.$t,10);1g(1k)}x 1f(){5 d=m;3(d.9("/r/s/")!=-1){3(d.9("?S-7")!=-1){n=d.D(d.9("/r/s/")+14,d.9("?S-7"))}c{n=d.D(d.9("/r/s/")+14,d.9("?&7"))}}3(d.9("?q=")==-1&&d.9(".6")==-1){3(d.9("/r/s/")==-1){i="w";3(m.9("#E=")!=-1){b=m.D(m.9("#E=")+8,m.P)}c{b=1}u.1l("<h T=\\""+y+"U/V/W?7-l=1&X=Y-Z-h&11=1a\\"><\\/h>")}c{i="s";3(d.9("&7-l=")==-1){j=1J}3(m.9("#E=")!=-1){b=m.D(m.9("#E=")+8,m.P)}c{b=1}u.1l(\'<h T="\'+y+\'U/V/W/-/\'+n+\'?X=Y-Z-h&11=1a&7-l=1" ><\\/h>\')}}}x N(F){12=(F-1)*j;G=F;5 13=u.1m(\'1n\')[0];5 v=u.1o(\'h\');v.1p=\'1q/1r\';v.1s("T",y+"U/V/W?1t-1u="+12+"&7-l=1&X=Y-Z-h&11=1b");13.1v(v)}x O(F){12=(F-1)*j;G=F;5 13=u.1m(\'1n\')[0];5 v=u.1o(\'h\');v.1p=\'1q/1r\';v.1s("T",y+"U/V/W/-/"+n+"?1t-1u="+12+"&7-l=1&X=Y-Z-h&11=1b");13.1v(v)}x 1b(Q){1c=Q.R.1K[0];5 1w=1c.1x.$t.D(0,19)+1c.1x.$t.D(1L,1M);5 1d=1N(1w);3(i=="w"){5 1e="/r?S-7="+1d+"&7-l="+j+"#E="+G}c{5 1e="/r/s/"+n+"?S-7="+1d+"&7-l="+j+"#E="+G}1O.f=1e}',62,113,'|||if|span|var|html|max||indexOf||nomerhal|else|thisUrl|class|href|jj|script|jenis|postperpage|showpageNum|results|urlactivepage|lblname1|maksimal|||search|label||document|newInclude|page|function|home_page|onclick|return|false|pageArea|substring|PageNo|numberpage|nopage|nomerkiri|parseInt|mulai|numshowpage|akhir|upPageWord|redirectpage|redirectlabel|length|root|feed|updated|src|feeds|posts|summary|alt|json|in||callback|jsonstart|nBody||banyakdata|prevnomer|nextnomer|blogPager||hitungtotaldata|finddatepost|post|timestamp|alamat|halamanblogger|loophalaman|for|downPageWord|innerHTML|totaldata|write|getElementsByTagName|head|createElement|type|text|javascript|setAttribute|start|index|appendChild|timestamp1|published|showpageOf|Page|of|showpage|showpagePoint|getElementsByName|getElementById|blog|pager|openSearch|totalResults|20|entry|23|29|encodeURIComponent|location'.split('|'),0,{}))//]]></script><!-- akhir navigasi angka andi-techno.blogspot.com -->

keterangan:

• var postperpage=6; >> angka 6 menunjukkan berapa jumlah posting yang akan ditampilkan dalam setiap halamannya silahkan sesuaikan selera
• var numshowpage=5; >> angka 5 menunjukkan berapa jumlah tombol navigasi yang akan tampil, silahkan sesuaikan selera

4. Cari kode 'data:label.url'  lalu ganti dengan kode 'data:label.url + &quot;?&amp;max-results=6&quot;'

keterangan: jika tidak menemukan kode 'data:label.url'  maka langkah no.4 bisa dilewatkan saja :D

5. Klik pratinjau dan lihat hasilnya, jika berhasil, klik Simpan Template

semoga artikel Membuat Navigasi Angka di Bawah Posting Blog ini dapat berguna

keyword: cara membuat tombol navigasi angka, tutorial membuat navigasi nomor , tutorial blog, membuat navigasi angka dibawah posting blog, cara membuat tombol navigasi nomor dibawah posting blog, navigasi angka, navigasi nomor