Cara Membuat Next Page di Blogger

waktunya mempercantik blog anda lagi. apa sih itu next page? gampangnya langsung lihat saja gambar di bawah ini

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>













<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 += '&nbsp;<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>



<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>

</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