Mengganti tulisan ( Postingan lama ) menjadi nomor urut

Mengganti tulisan ( Postingan lama ) menjadi nomor urut

Mengganti tulisan ( Postingan lama ) menjadi nomor urut

Mengganti tulisan ( Postingan lama ) menjadi nomor urut. Membuat navigasi halaman dengan angka. Memudahkan pengunjung dengan merubah navigasi halaman dengan angka.
Dari beberapa survey dan pengalaman saya, pengunjung akan lebih berlama-lama berada di blog kita karena ada sesuatu yang menarik dari blog kita, misalnya postingan populer. Lalu apa hubungan
dengan postingan ini, yap pasti kalian bingung, begini penjelasannya sobat , tulisan posting lama cenderung kaku, tidak menunjukkan banyak postingan, tapi jika kalian menngunakan script di bawah, maka tampilan blog anda akan seperti ini :


Jadi pengunjung akan lebih tertarik untuk melihat posting pada halaman berikutnya karena melihat angka-angka pada navigasi halaman anda ( 1,2,3 ), tulisan page 1 of ... juga dapat memicu ketertarikan pengunjung untuk melakukan follow atau feedburner, karena blog yang memiliki postingan yang melimpah dan up to date banyak di incar para pengunjung yang mencari info. Yaudahlah ga usah banyak basa-basi, silahkan download, eh satu lagi, Script yang saya sediakan ini tidak akan membuat anda pusing, karena penempatan script ini berada pada edit elemen halaman [tambah gaget - Html/javascript - pastekan script tadi - lalu save ] tidak perlu ke edit Html.

<style>
.showpageArea {
padding:2px;
margin:0px auto;
text-align: center;
}
.showpageArea a {border: 1px solid #FFFFFF;
color: #FF8000;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 #fff;
color: #FF8000;
background-color: #000000;
}

.showpageNum a {border: 1px solid #FFFFFF;
color: #FF8000;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 #fff;
color: #FF8000;
background-color: #000000;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #fff;
color: #fff;
background-color: #000000;


}

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

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #FFFFFF;
color: #FF8000;
background-color: #000000;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #fff;
color: #FF8000;
background-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=7;
var displayPageNum=2;
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="font-size:11px;padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;color: #FF8000;border: 1px solid #fff; background-color: #000000;" 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"></a><a href="http://www.aan20.co.cc/">Aan Blog</a></div>

Selamat mencoba dan semoga berhasil!!!
Blogger
Disqus
Pilih Sistem Komentar

7 comments

thanks for posting a good article

Balas

Makasih juga mas Mustofa....

Balas

waw..ini yang aku cari, ketemu juga..., simpel, tinggal copas, dan tak perlu merubah html...yang salah2 bisa bikin kacaw blog...trims sob...

Balas

Wah terimakasih gan sangat bermanfaat :D

Balas

info yg bagusss....
http://qaryatulhuda.blogspot.com

Balas

makasih postinganya gan, sangat membatu...siap menuju TKP

Balas

Mohon maaf, Komentar yang tidak relevan, spaming, kata2 kotor, mengandung SARA atau permusuhan akan kami hapus...

Advertiser