Home» Blog» Ttutorial blogger» Cara Membuat Next Page di Blogger

Cara Membuat Next Page di Blogger

Oleh Admin Thursday, August 19, 2010

Jika anda tertarik untuk membuat yang seperti ini pada blog anda langsung saja ikuti Step By Step di bawah ini

1. Login ke blogger anda tentunya

2. Masuk ke Tata Letak

3. Tambah Gadget >> HTML/JavaScript

4. Copy pastekan code berikut di dalamnya

<style> .showpageArea a { text-decoration:underline; } .showpageNum a { text-decoration:none; border: 1px solid #ccc; margin:0 3px; padding:3px; } .showpageNum a:hover { border: 1px solid #ccc; background-color:#ccc; } .showpagePoint { color:#333; text-decoration:none; border: 1px solid #ccc; background: #ccc; margin:0 3px; padding:3px; } .showpageOf { text-decoration:none; padding:3px; margin: 0 3px 0 0; } .showpage a { text-decoration:none; border: 1px solid #ccc; padding:3px; } .showpage a:hover { text-decoration:none; } .showpageNum a:link,.showpage a:link { text-decoration:none; color:#333; }  </style><br /> <br /> <br /> <br /> <br /> <br /> <br /> <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=6; var firstPageWord = 'First'; var endPageWord = 'last'; var upPageWord ='Back'; var downPageWord ='Next';   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"></span>'+upPageHtml+' '+html +' '; } }  html = '<div class="showpageArea"><span style="color:#fff;" class="showpage"> Total '+(postNum-1)+': </span>'+html;  if(thisNum<(postNum-1)){ html += downPageHtml;  }  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><br /> <br /> <script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script><br /> </br><br /> <a href="http://abi-galoga.blogspot.com/" rel="me" target="_blank">next page</a>

Catatan : untuk mengatur jumlah posting dalam satu halaman silahkan atur code beirkut

var pageCount=5;

jika anda ingin menampilkan 10 posting satu halaman maka

var pageCount=10;

Simpan. mudahkan?sulit?bagaimana bisa yang semudah ini di bilang sulit -__- hahaha

Share Tweet Plus

Filed in: Blog,Ttutorial blogger