Cara Membuat Navigasi Halaman Cantik

Cara Membuat Navigasi Halaman Cantik

Add Comment

Kali ini kita pasang navigasi halaman. Ini hanya widget yang tidak memberatkan loading blog anda. Silahkan ikuti langkah berikut.
navigasi halaman

Log in ke blog anda
Klik Rancangan

rancangan

Klik Tambah Gadget

tambah gadget

Pilih HTML/JavaScript

masukkan kode

Masukkn kode berikut ke dalamnya
<style type="text/css">
#blog-pager{padding:5px 0 !important}
.showpageArea{font-weight:bold; margin:5px}
.showpageArea a{text-decoration:underline; color:#fff}
.showpageNum a, .showpage a{color:#fff; text-decoration:none; border:1px solid #999; -webkit-border-radius:3px; -moz-border-radius:3px; margin:0 3px; padding:3px 5px; 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 )}
.showpageNum a:hover, .showpage a:hover{border:1px solid #ccc; 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 )}
.showpagePoint{color:#aaa; text-decoration:none; border:1px solid #999; -webkit-border-radius:3px; -moz-border-radius:3px; margin:0 3px; padding:3px 5px; background:#e2e2e2; background:-moz-linear-gradient(top,#e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#e2e2e2),color-stop(50%,#dbdbdb),color-stop(51%,#d1d1d1),color-stop(100%,#fefefe)); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2',endColorstr='#fefefe',GradientType=0 )}
.showpageOf{text-decoration:none; padding:3px; margin:0 3px 0 0}
.showpageNum a:link, .showpage a:link{text-decoration:none; color:#fff}
</style>
<script type='text/javascript'>
var home_page="/";
var urlactivepage=location.href;
var postperpage=5;
var numshowpage=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://bloekoetoek-blogonol.googlecode.com/files/blogonol-pagenavigation.js' type='text/javascript'></script>

Simpan dan lihat hasilnya
Selamat mencoba dan sukses selalu



"keep spirits and do the best"
Mau belajar trick dan tips blogging lengkap dan mudah?... BACA DI SINI

About the Author

Blogonol adalah Blog - 0 atau blog kosong dengan konten tutorial blog, seo, widget, template gratis, dan blog info yang dikonsep secara sederhana untuk belajar membangun blog yang lebih baik.