Pada umumnya dibawah Postingan Blog ada Link Previous - Home - Next dan ada juga yang berupa Image / Tanda atau memakai Nomor [angka] yang fungsinya tak perlu saya jelaskan karena semua kawan Blogger sudah mengetahuinya, tapi sekarang yang akan saya bahas adalah Cara Pasang Nomor Halaman Navigasi yang bahasanya mbah Google kurang lebih adalah Numbered Page Navigation, contohnya bisa kawan lihat di Blog saya ini :z;
Cara Pasangnya sebagai berikut :
- Masuk Account Blogger dengan ID kawan
- Pada Dasbor pilih Tata Letak - Tambah Gadget - HTML / JavaScript
- Copas script berikut kedalamnya
<!-- Numbered Page Navigation Widget For Blogger oleh BlogBego @ http://blogbego-creation.blogspot.com -->
<style type='text/css'>
#blog-pager{
font-size:normal;
padding:10px 0;
clear:both;
}
.showpageArea{
font-family:verdana,arial,helvetica;
color:#000;
font-size:11px;
margin:10px;
}
.showpageArea a{
color:#fff;
}
.showpageNum a{
padding:3px 8px;
margin:0 1px;
text-decoration:none;
background:#FFF;
border: 1px solid #999; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius:3px;
}
.showpageNum a:hover{
background: #3b679e; background: -moz-linear-gradient(top, #3b679e 0%, #2b88d9 50%, #207cca 51%, #7db9e8 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3b679e), color-stop(50%,#2b88d9), color-stop(51%,#207cca), color-stop(100%,#7db9e8)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b679e', endColorstr='#7db9e8',GradientType=0 );
border: 1px solid #333; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius:3px;
}
.showpagePoint{
color:#fff;
padding: 4px 8px;
margin: 0 5px;
font-weight:700;
background: #aebcbf; background: -moz-linear-gradient(top, #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#aebcbf), color-stop(50%,#6e7774), color-stop(51%,#0a0e0a), color-stop(100%,#0a0809)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebcbf', endColorstr='#0a0809',GradientType=0 );
text-decoration:none;
border: 2px solid #F00; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius:15px;
}
.showpageOf{
background:#95CAFF;
border: 1px solid #333; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius:3px;
margin: 0 5px 0 0;
padding:3px 8px;
}
</style>
<script style='text/javascript'>
var numshowpage=4;
var postperpage =5;
var upPageWord="Previous";
var downPageWord="Next";
var home_page="/";
var urlactivepage=location.href;
</script>
<script src='https://sites.google.com/site/blogbegocreation/javascript/blogbego_pnavi.js' style='text/javascript'/>
<!-- Numbered Page Navigation Widget For Blogger oleh BlogBego @ http://blogbego-creation.blogspot.com -->
Kalau kawan ingin menyimpannya di Template
Caranya sebagai berikut :
- Pada Dasbor pilih Template
- Beri tanda check disamping
- Cari <b:includable id='shareButtons' var='post'> atau <data:homeMsg/> yang pertama sebelum </b:includable> selengkapnya kurang lebih sebagai berikut :
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>
</div>
<div class='clear'/>
SIMPAN DISINI SCRIPTNYA
</b:includable>
<b:includable id='shareButtons' var='post'>
Simpan Template kawan
.gif)
