Numbered Page Navigation For Blogger

Cara membuat numbering pada bahagian bawah post seperti yang anda dapat lihat pada gambar dibawah ini atau pun di blog ini....

blogger page navigation
Tanpa membuang masa apakata ikut cara ini:

1.Login ke Blogger Dashboard dan arahkan ke Layout> Edit Html 
2.Kemudian Tip pada ' Expand Template Widget ' 
3.Sekarang Cari Kod  ini



]]></b:skin>


Lepas tu gantikan kod warna merah diatas dengan kod warna biru dibawah ini



.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}
]]></b:skin>
 
 
Langkah 4 Cari kod warna merah dibawah ini  
 
</body> 
 
Kemudian gantikan kod warna merah diatas dengan kod dibawah ini
 

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;var displayPageNum=5;var upPageWord =&#39;Previous&#39;;var downPageWord =&#39;Next&#39;;</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>
</b:if>
<!--Page Navigation Ends -->
</body>
 
 
Kemudan save dan lihat hasilnya.
 
 
-Seperti yang anda lihat diatas, 
ada beberapa parameter boleh disesuaikan dalam kod ini
 
 
var pageCount = 5; 
Kod diatas ini menentukan jumlah posting yang akan dipaparkan pada halaman. 
var displayPageNum = 5;
Kod diatas ini menentukan jumlah tambahan  
nombor navigation laman yang akan dipaparkan pada halaman.

var upPageWord =&#39;Previous&#39;;var downPageWord =&#39;Next&#39;;
Kedua-dua baris diatas menentukan teks yang akan dipaparkan untuk laman sebelumnya dan halaman seterusnya masing-masing.
 
Selamat Mencuba :) semoga blog cantik dan sihat..
sebarang masalah boleh hubungi admin JT
 
Previous
Next Post »