Kamis, 13 Juni 2013

Home » » Cara membuat tombol Next Page Angka Pada Blog

Cara membuat tombol Next Page Angka Pada Blog

Pada postingan kali ini Cik awi akan berbagi artikel tentang cara membuat tombol next page angka pada blog , yang mana tombol ini berfungsi buat mengarahkan para pengunjung untuk melihat halaman demi halaman yang berada pada blog kita berdasarkan angka yang tertera dalam tombol tersebut. Kurang lebih penampakanya seperti ini gan:

cik_awi

Nah Cara memasangnya pun cukup mudah gak perlu edit html ke template ikuti langkah sebagai berikut :

1. Masuk ke Dashbor,
2. klik rancangan.
3. Tambah Gadget
4. Pilih HTML
5. Lalu Masukkan kode :

<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:#000000; } .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:#000000; } </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 class="showpage">Page'+(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>

Demikian postingan dari saya tentang Cara membuat tombol next page angka pada blog

Ada 9 Komentar Pada Artikel » Cara membuat tombol Next Page Angka Pada Blog

  1. thanks mas atas sharenya ...

    BalasHapus
  2. wah keren mas, thx sharing nya :)

    BalasHapus
  3. saya baru tau ini mas caranya, karena di blog saya tuh udah bawaan template, ternyata banyak juga kodenya...

    BalasHapus
  4. saya juga sempaet memakainya sob, tapi nggak di blog yang ini. sama dengan script di atas, tapi saya juga lupa lagi, dan kebetulan di sini ada ijin nyomot sob.

    BalasHapus
  5. Akan saya praktekan sob..thx for share

    BalasHapus
  6. kodenya banyak juga ternyata mas, saya cuma bisa menyerap ilmunya saja mas..siapa tahu nanti pengen

    BalasHapus
  7. makasih buat informasi nya yaaa :)

    BalasHapus
  8. keren juga ya gan.,

    ntar kapan2 ane coba ah.,

    nice info gan,.

    BalasHapus

Label terkait:
|widget|Tips n trik1|Tips n trik2|Suak Putat|Seputar Jambi|Sejarah|Saint|Kehidupan|Religi|Olahraga|Mp3|Layanan|Langka tapi Nyata|Game|Ekonomi|Aplikasi|Kamus Bahasa|

Diberdayakan oleh Blogger.