Cara Membuat Menu Page Next Pada Blog

Kali ini saya akan membahas tentang cara membuat tombol navigasi next atau previous page. Lansung saja yah karena saya tidak punya banyak kata-kata lagi.

Langkah Langkah :

1.login ke blogger.
2.tataletak --->element halaman
3.tambahkan gedget.
4.pilih html/javascript
5.masukkan kode di bawah ini.

<br><style><br>.showpageArea a {<br>text-decoration:underline;<br>}<br>.showpageNum a {<br>text-decoration:none;<br>border: 1px solid #ccc;<br>margin:0 3px;<br>padding:3px;<br>}<br>.showpageNum a:hover {<br>border: 1px solid #ccc;<br>background-color:#ccc;<br>}<br>.showpagePoint {<br>color:#333;<br>text-decoration:none;<br>border: 1px solid #ccc;<br>background: #ccc;<br>margin:0 3px;<br>padding:3px;<br>}<br>.showpageOf {<br>text-decoration:none;<br>padding:3px;<br>margin: 0 3px 0 0;<br>}<br>.showpage a {<br>text-decoration:none;<br>border: 1px solid #ccc;<br>padding:3px;<br>}<br>.showpage a:hover {<br>text-decoration:none;<br>}<br>.showpageNum a:link,.showpage a:link {<br>text-decoration:none;<br>color:#333;<br>}<br><br></style><br><br><script type="text/javascript"><br><br>function showpageCount(json) {<br>var thisUrl = location.href;<br>var htmlMap = new Array();<br>var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";<br>var isLablePage = thisUrl.indexOf("/search/label/")!=-1;<br>var isPage = thisUrl.indexOf("/search?updated")!=-1;<br>var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";<br>thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;<br>var thisNum = 1;<br>var postNum=1;<br>var itemCount = 0;<br>var fFlag = 0;<br>var eFlag = 0;<br>var html= '';<br>var upPageHtml ='';<br>var downPageHtml ='';<br><br>var pageCount=5;<br>var displayPageNum=6;<br>var firstPageWord = 'First';<br>var endPageWord = 'last';<br>var upPageWord ='Back';<br>var downPageWord ='Next';<br><br><br>var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';<br><br>for(var i=0, post; post = json.feed.entry[i]; i++) {<br>var timestamp = post.published.$t.substr(0,10);<br>var title = post.title.$t;<br>if(isLablePage){<br>if(title!=''){<br>if(post.category){<br>for(var c=0, post_category; post_category = post.category[c]; c++) {<br>if(encodeURIComponent(post_category.term)==thisLable){<br>if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){<br>if(thisUrl.indexOf(timestamp)!=-1 ){<br>thisNum = postNum;<br>}<br><br>postNum++;<br>htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;<br>}<br>}<br>}<br>}//end if(post.category){<br><br>itemCount++;<br>}<br><br>}else{<br>if(title!=''){<br>if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){<br>if(thisUrl.indexOf(timestamp)!=-1 ){<br>thisNum = postNum;<br>}<br><br>if(title!='') postNum++;<br>htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;<br>}<br>}<br>itemCount++;<br>}<br>}<br><br>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>';<br>}else{<br>upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';<br>}<br>}else{<br>upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';<br>}<br><br>fFlag++;<br>}<br><br>if(p==(thisNum-1)){<br>html += ' <span class="showpagePoint"><u>'+thisNum+'</u></span>';<br>}else{<br>if(p==0){<br>if(isLablePage){<br>html = labelHtml+'1</a></span>';<br>}else{<br>html += '<span class="showpageNum"><a href="/">1</a></span>';<br>}<br>}else{<br>html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';<br>}<br>}<br><br>if(eFlag ==0 && p == thisNum){<br>downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';<br>eFlag++;<br>}<br>}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){ }//end for(var p =0;p< htmlMap.length;p++){ if(thisNum>1){<br>if(!isLablePage){<br>html = '<span class="showpage"></span>'+upPageHtml+' '+html +' ';<br>}<br>}<br><br>html = '<div class="showpageArea"><span class="showpage"> Total '+(postNum-1)+': </span>'+html;<br><br>if(thisNum<(postNum-1)){ html += downPageHtml; } if(postNum==1) postNum++; html += '</div>';<br><br>if(isPage || isFirstPage || isLablePage){<br>var pageArea = document.getElementsByName("pageArea");<br>var blogPager = document.getElementById("blog-pager");<br><br>if(postNum <= 2){ html =''; } for(var p =0;p< pageArea.length;p++){ pageArea[p].innerHTML = html; } if(pageArea&&pageArea.length>0){<br>html ='';<br>}<br><br>if(blogPager){<br>blogPager.innerHTML = html;<br>}<br>}<br><br>}<br></script><br><br><script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script><br>

untuk mengatur jumlah dalam satu halaman lihat

var pageCount=5;

semoga bermanfaat....

Posted in: