Buat page kat Blog

Terharu betul..hari ni saya akhirnya berjaya belajar buat page kat blog ni. Tanpa membuang masa..sesiapa yang nak buat page tu di persilakan "copy dan "paste" coding ni. Berikut adalah langkah-langkah membuat page kat blog anda.

1.Masuk kat "dashboard" blog anda

2.Click kat "Design"

3.Bawak cursor tu kat page bawah sekali..pilih salah satu kotak kat bawah tu dan click "Add a gadjet"

4.Pilih "Add a HTML/Javascript"

5.Copy code di bawah ni dan paste kat column tu. Coding ni agak panjang sikit..

<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 = 'First';

var endPageWord = 'Last';

var upPageWord ='Previous';

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

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

Grab this Widget ~ Blogger Accessories

Grab this Widget ~ Blogger Accessories

6.Rename sebagai Pages

7.Save

8.View blog anda..dah siap pun pages yang dipasang tadi.