Page Navigation adalah bagian dari template yang berfungsi untuk berpindah page (halaman) atau nomor urut page di blog atau website. biasanya pada template default blog yaitu seperti gambar di bawah.
Untuk mengubah tampilan Page Navigation ke yang kita inginkan sebagaimana gambar yang saya tunjukan dibawah itu mudah dan gampang. Saya juga menyajikan beberapa style page navigation lain yang mungkin Anda suka.
Adapun caranya yaitu:
- Pergi ke "Rancangan"/"Edit HTML" di Dasbor blog Anda (dengan sebelumnya jangan lupa login)
- Back up Template yang ada sebelum membuat perubahan!
- Pastikan untuk menceklis "Expand Template Widget" kotak.
- Cari tag ]]></b:skin>
- Tambahkan kode berikut sebelum atau di atas tag ]]></b:skin>
/* Fungsi page navigation dx
--------------------------------------- */
.blog-pager,#blog-pager {padding:10px 10px;border:1px solid #ddd;}
.showpageArea{float:left;background:#111;}
.showpageOf{margin:0 1px 0 0;padding:3px 7px;color:#333333;border:1px solid #bbb;}
.showpageArea a {text-decoration:underline;}
.showpageNum a {border:1px solid #bbb;color:#000;font-weight:bold;margin-bottom:0;margin-left:1px;margin-right:1px;
padding:3px 7px;text-decoration:none;}
.showpageNum a:hover {
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV6bSoAMOGVQFAX365APvMhkVYKfXGIfDI1tFo3NVMdzWAun1bxrPwrm5ThK-xPYmYw-7sGh26-3UUitU5D2eQszfm87QVNgjSGXuXAaujl9tHHIewGJwFwFsn235Muas2txVCDRiJZ4M/s0/glass.png") repeat-x scroll 0 100% rgba(0, 0, 0, 0.07);border:1px solid #bbb;color:#000000;font-weight:bold;}
.showpagePoint {-moz-background-inline-policy:continuous;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV6bSoAMOGVQFAX365APvMhkVYKfXGIfDI1tFo3NVMdzWAun1bxrPwrm5ThK-xPYmYw-7sGh26-3UUitU5D2eQszfm87QVNgjSGXuXAaujl9tHHIewGJwFwFsn235Muas2txVCDRiJZ4M/s0/glass.png") repeat-x scroll 0 100% rgba(0, 0, 0, 0.07);border:1px solid #bbb;color:#000000;
font-weight:bold;margin:1px 1px;padding:3px 7px;text-decoration:none;}
.showpageOf {color:#000000;font-weight:bold;margin:0 1px 0 0;padding:3px 7px;text-decoration:none;}
.showpage a {border:1px solid #bbb;font-weight:bold;padding:3px 7px;text-decoration:none;}
.showpage a:hover {text-decoration:none;}
.showpageNum a:link, .showpage a:link {color:#000000;font-weight:bold;text-decoration:none;}
- Setelah itu tambahkan pula kode HTML di bawah sebelum atau di atas tag </body>
<script type='text/javascript'>Catatan:
var home_page="/";
var urlactivepage=location.href;
var postperpage=9;
var numshowpage=9;
var upPageWord ='Kembali';
var downPageWord ='Selanjutnya';
</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>
- Untuk yang berwarna merah dapat Anda ganti dengan Kata-kata lain sesuai keinginan.
- Untuk yang berwarna biru merupakan jumlah tampilan page, silakan sesuaikan dengan kebutuhan Anda
- Selamat berkreasi
Mantap puisinya mas... Supaya itu terhubung ke link untuk nulis atau masukkan fhoto gmana mas ya? Soalnya untuk ke laman kayak ke beranda itu gak ada link ke laman barunya...
BalasHapussaya sedikit kaga ngerti dengan apa yang ditanyakan,,, kalo mungkin untuk menautkan ke beranda, tinggal tambah link beranda,,,, bisa diperjelas untuk pertanyaannya?
Hapus