paginate-blogger-posts

<!----> 
<style>

.showpageArea {
	padding: 0 2px;
	margin-top:10px;
	margin-bottom:10px;
}
.showpageArea span{
	border-radius: 4px;
}


.showpageArea a {border: 1px solid #505050;
	color: #000000;
	font-weight:normal;
	padding: 3px 6px !important;
	padding: 1px 4px ;
	margin:0px 4px;
	text-decoration: none;
	border-radius: 4px;
}
.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;
	border-radius: 4px;

}
.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: rgba(51, 0, 17, 0.9);


}

.showpage a:hover {font-size:11px;
	border: 1px solid #333;
	color: #000000;
	background-color: #FFFFFF;

}
.showpageNum a:link,.showpage a:link, .showpageNum a:visited,.showpage a:visited{
	font-size:11px;
	padding: 2px 4px 2px 4px;
	margin: 2px;
	text-decoration: none;
	border: 1px solid #0066cc;
	color: #0066cc;
	background-color: #FFFFFF;
}
.showpageNum a:visited,.showpage a:visited{
	color: #3D22F9;
	border-color: #3D22F9;
}
.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.split("#").shift();
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=10;
pageCount= (thisUrl.indexOf("q=")>0) ? 20 : pageCount;

var displayPageNum=5;
var firstPageWord = '首頁';
var endPageWord = '最末頁';
var upPageWord ='上一頁';
var downPageWord ='下一頁';



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);
	//document.write( post.published.$t + "<br>")
	var timestamp = post.published.$t;
	timestamp = timestamp.replace(timestamp.substring(timestamp.indexOf("."), timestamp.indexOf("+")) , "");
	timestamp = encodeURIComponent(timestamp)
	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 % pageCount == 0){
							if(thisUrl.indexOf(timestamp)!=-1 ){
								thisNum = postNum;
							}

							postNum++;
							htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max=' + timestamp + '&max-results=' + pageCount;
						}
					}
				}
			}//end if(post.category){ //}

			itemCount++;
		//}

	}else{
		//if(title!=''){
			
			if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
				
				if(title!='') postNum++;
				htmlMap[htmlMap.length] = '/search?updated-max=' + timestamp + '&max-results='+pageCount;
			}
			if(thisUrl.indexOf(timestamp)!=-1 ){
				thisNum = postNum;
			}
		//}
		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">第 '+thisNum+' 頁。共 '+(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>
/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>
<div style="text-align:right;font-size:10px;color:000000;margin-top:15px;display:none;"> <a href="http://rias-techno-wizard.blogspot.com/2008/07/page-navigation-hack-for-blogger.html">Grab this Widget ~ Blogger Accessories</a></div>
<!---->