MG_Arlene VIP Member
Community Anak Bangsa Jumlah posting : 38 Points : 247 Reputation : 35 Join date : 07.04.11 Age : 32 Lokasi : Bekasi
| Subyek: Membuat Navigasi Halaman Bernomor/Paging Thu Apr 07, 2011 12:07 pm | |
| Setelah lama saya mencari akhirnya dapat juga, jika biasanya pada halaman pada blog anda hanya ada older post ternyata itu bisa di ganti dengan halaman bernomor seperti gambar berikut: penasaran bagaiman cara membuatnya, langsung aja : yang paling penting anda harus login dulu 2. masuk ke tata letak (layout) >> element halaman 3. tambah gedget >> pilih HTML/java script 4. copas dan code berikut: - Code:
-
[code]<style> .showpageArea {padding: 0 2px;margin-top:10px;margin-bottom:10px; } .showpageArea a {border: 1px solid #505050; color: #000000;font-weight:normal; padding: 3px 6px !important; padding: 1px 4px ;margin:0px 4px; text-decoration: none; } .showpageArea a:hover { font-size:11px; border: 1px solid #333; color: #000000; background-color: #FFFFFF; }
.showpageNum a {border: 1px solid #505050; color: #000000;font-weight:normal; padding: 3px 6px !important; padding: 1px 4px ;margin:0px 4px; text-decoration: none;
} .showpageNum a:hover { font-size:11px; border: 1px solid #333; color: #000000; background-color: #FFFFFF;
} .showpagePoint {font-size:11px; padding: 2px 4px 2px 4px; margin: 2px; font-weight: bold; border: 1px solid #333; color: #fff; background-color: #000000;
}
.showpage a:hover {font-size:11px; border: 1px solid #333; color: #000000; background-color: #FFFFFF;
} .showpageNum a:link,.showpage a:link { font-size:11px; padding: 2px 4px 2px 4px; margin: 2px; text-decoration: none; border: 1px solid #0066cc; color: #0066cc; background-color: #FFFFFF;}
.showpageNum a:hover {font-size:11px; border: 1px solid #333; color: #000000; background-color: #FFFFFF; } </style>
<script type="text/javascript">
function showpageCount(json) { var thisUrl = location.href; var htmlMap = new Array(); var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/"; var isLablePage = thisUrl.indexOf("/search/label/")!=-1; var isPage = thisUrl.indexOf("/search?updated")!=-1; var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : ""; thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable; var thisNum = 1; var postNum=1; var itemCount = 0; var fFlag = 0; var eFlag = 0; var html= ''; var upPageHtml =''; var downPageHtml ='';
var pageCount=5; var displayPageNum=3; var firstPageWord = '[color=red]First[/color]'; var endPageWord = '[color=red]Last[/color]'; var upPageWord ='[color=red]Previous[/color]'; var downPageWord ='[color=red]Next[/color]';
var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';
for(var i=0, post; post = json.feed.entry[i]; i++) { var timestamp = post.published.$t.substr(0,10); var title = post.title.$t; if(isLablePage){ if(title!=''){ if(post.category){ for(var c=0, post_category; post_category = post.category[c]; c++) { if(encodeURIComponent(post_category.term)==thisLable){ if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){ if(thisUrl.indexOf(timestamp)!=-1 ){ thisNum = postNum; }
postNum++; htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount; } } } }//end if(post.category){
itemCount++; }
}else{ if(title!=''){ if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){ if(thisUrl.indexOf(timestamp)!=-1 ){ thisNum = postNum; }
if(title!='') postNum++; htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount; } } itemCount++; } }
for(var p =0;p< htmlMap.length;p++){ if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){ if(fFlag ==0 && p == thisNum-2){ if(thisNum==2){ if(isLablePage){ upPageHtml = labelHtml + upPageWord +'</a></span>'; }else{ upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>'; } }else{ upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>'; }
fFlag++; }
if(p==(thisNum-1)){ html += ' <span class="showpagePoint"><u>'+thisNum+'</u></span>'; }else{ if(p==0){ if(isLablePage){ html = labelHtml+'1</a></span>'; }else{ html += '<span class="showpageNum"><a href="/">1</a></span>'; } }else{ html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>'; } }
if(eFlag ==0 && p == thisNum){ downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>'; eFlag++; } }//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){ }//end for(var p =0;p< htmlMap.length;p++){
if(thisNum>1){ if(!isLablePage){ html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' '; }else{ html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' '; } }
html = '<div class="showpageArea"><span style="padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;border: 1px solid #333; background-" class="showpage">Page '+thisNum+' of '+(postNum-1)+': </span>'+html;
if(thisNum<(postNum-1)){ html += downPageHtml; html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>'; }
if(postNum==1) postNum++; html += '</div>';
if(isPage || isFirstPage || isLablePage){ var pageArea = document.getElementsByName("pageArea"); var blogPager = document.getElementById("blog-pager");
if(postNum <= 2){ html =''; }
for(var p =0;p< pageArea.length;p++){ pageArea[p].innerHTML = html; }
if(pageArea&&pageArea.length>0){ html =''; }
if(blogPager){ blogPager.innerHTML = html; } }
} </script>
<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>[/code] 5. text yang berwarna merah bisa anda ganti dengan tetx seperti: first menjadi home, next menjadi lanjut, Previous menjadi kembali last menjadi terakhir 6. letakkan di bawah posting blog seperti gambar berikut: 7. simpan template, lihat hasilnya . . . SEMOGA BERMANFAAT | |
|
MG_Santi Viper Spammer
Community Anak Bangsa Jumlah posting : 95 Points : 3213 Reputation : 106 Join date : 06.04.11 Age : 34 Lokasi : Jakarta
| Subyek: Re: Membuat Navigasi Halaman Bernomor/Paging Thu Apr 07, 2011 12:09 pm | |
| | |
|