Cara Saya berbagi tentang : Cara Membuat Halaman Bernomor Di Blog Untuk Menambah Wawasan

Cara Saya berbagi tentang Cara Membuat Halaman Bernomor Di Blog kepada teman-teman sobat blogger dirumah Tujuan artikel Cara Membuat Halaman Bernomor Di Blog menambah wawasan Jika Sobat Suka Dengan Cara Membuat Halaman Bernomor Di Blog dapat sharing dengan yang lainnya Ya udah Langsung saja Membaca Cara Membuat Halaman Bernomor Di Blog pada blog ini

Kalau sobat blogger berada di halaman beranda (Home page) blog ini, maka sobat blogger akan melihat atau menemukan adanya Page Navigation (Navigasi halaman). Halaman bernomor ini saya buat untuk mempermudah pengunjung blog saya untuk menemukan postingan yang mereka butuhkan. Setiap halaman sudah saya atur sedemikian rupa sehingga hanya menampilkan lima postingan untuk setiap halaman. Kalau jumlah postingan yang saya tampilkan lebih dari lima postingan, sudah pasti loading untuk tiap halamannya akan berat.






Untuk membuat navigasi halaman bernomor, sobat blogger tidak perlu edit template (Ya... Jauh berbeda dengan tutorial blogger di blog lain). Yang perlu sobat blogger lakukan hanya menambahkan sedikit kode CSS (Cascading Style Sheet) di kolom HTML/JavaScript. Untuk lebih jelasnya, ikuti saja tutorial blogspot yang saya berikan di bawah ini.


Cara Buat Navigasi Halaman di Blog

  • Sign In di blogger.com
  • Pada Menu Drop Down klik Layout
  • Klik Add a gadget dan pilih HTML/JavaScript.
  • Copy Paste kode berikut pada kolom yang tersedia :
<style type='text/css'>
#blog-pager{height: 28px;
    padding: 10px 0 0;
overflow:hidden;
text-align:center;
}
.showpageArea a {text-decoration:underline;
font-size: 16px;
       text-align: center;}
.showpageNum a {font-size:16px;text-decoration:none;border: 1px solid #cccccc;margin:0 5px;padding:5px;}
.showpageNum a:hover {border: 1px solid #cccccc;background-color:#cccccc;}
.showpagePoint {font-size:16px;text-decoration:none;border: 1px solid #cccccc;background: #216FD9;margin:0 5px;padding:5px;color:#ffffff;}
.showpageOf {text-decoration:none;padding:5px;margin: 0 5px;}
.showpage a {text-decoration:none;border: 1px solid #cccccc;padding:5px;}
.showpage a:hover {text-decoration:none;background: #cccccc;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;}</style>
<script style='text/javascript'>var pageCount=5;
var displayPageNum=5;var upPageWord="Previous";var downPageWord="Next";</script>
<script style='text/javascript' src='http://tutorialblogspot.googlecode.com/files/halamanblog.js'></script>
<p style="display:none;">Page Navigation by<a href="http://indosoftgame.blogspot.com/" rel="dofollow">

http://indosoftgame.blogspot.com/</a></p>
  • Simpan widget sobat.

Tambahan :

  1. Jangan kasih judul buat widget sobat.
  2. Angka 5 merupakan jumlah posting yang akan ditampilkan.
  3. Yang warna merah adalah kode warna, silahkan sobat blogger sesuaikan.
Cara Saya berbagi tentang Cara Membuat Halaman Bernomor Di Blog kepada teman-teman sobat blogger dirumah Tujuan artikel Cara Membuat Halaman Bernomor Di Blog menambah wawasan Jika Sobat Suka Dengan Cara Membuat Halaman Bernomor Di Blog dapat sharing dengan yang lainnya

0 comments:

Poskan Komentar