Welcome to my blog, hope you enjoy reading :)
RSS

Monday, August 30, 2010

Cara Membuat Page Number-Navigasi Halaman

Page Number atau Navigasi Halaman dengan menggunakan nomor atau angka adalah sebagai alat navigasi yang berfungsi selain dapat mempercantik tampilan halaman utama juga dapat memudahkan pengunjung dalam menjelajahi content sebuah website atau blog. Lihat contohnya pada halaman blog saya ini,
Apakah Sobat Sekalian ingin mencobanya? Jika iya, maka berikut ini adalah langkah-langkah Cara Membuat Page Number-Navigasi Halaman Blog khususnya blogspot.com :

  1. Masuk dahulu ke Dashboard blogspot Anda, selanjutnya pilih Rancangan (Layout) dan pilih Edit HTML, seperti biasa contreng option Expand Widget Templates, selanjutnya cari kode berikut: ]]></b:skin>;
  2. Setelah ketemu, di atas kode ]]></b:skin> letakkan kode di bawah 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;

    }
  3. Lalu cari lagi kode seperti ini: </body>;
  4. Jika sudah ketemu, di atas kode </body> letakkan script di bawah ini:


    <b:if cond='data:blog.pageType != &quot;item&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>
  5. Selanjutnya carilah kode berikut ini : 'data:label.url';
  6. Hapus kode ini : 'data:label.url' dan gantilah dengan kode di bawah ini:



    'data:label.url + &quot;?&amp;max-results=5&quot;'
  7. Terakhir Simpan Templates dan lihat hasilnya.

13 comments:

  1. ko di tempatkuu tulisan
    'data.label.url' nya gag ada??
    trus gimana mau bkin navigasi page number???

    repp pliss...
    bantuin bikin blog..

    ReplyDelete
  2. Mantap mas ilmunya bermamfaat dan sudah berhasil di terapkan,,terimakasih dan sukses ya..
    kunjungi juga blog saya

    http://pelangiholiday.wordpress.com
    http://pelangiholiday.blogspot.com

    ReplyDelete
  3. maaf kk klo bikn ini gmna sih aq dah cba terus susah banget apa lagi nyari code 'data:label.url';
    di ctrl+f pun gak ketemu susah
    tolong bantu yah kk????
    makasih

    ReplyDelete
  4. saI..,koQ puNya ku jadI gItu???
    LIat deh...
    http://widyafika.blogspot.com

    ReplyDelete
  5. terima kasih infonya... i like it...

    ReplyDelete
  6. oG g Da.,,,??
    'data:label.url'

    ReplyDelete
  7. gmn nhe mas kok di blog kok navgasinya ga keluar pdahal cara2 diats dah kuterapkan,.,.,.

    MOHON BANTUANNYA.

    ReplyDelete
  8. aduh maaf agan2.........
    msa bisa gk ad sih,,,,,,,,,gni,,kadang kalau masalah tergantung dngan tidak ad nya kode yg kalian blng d atas,,,,mngknnya udh klian tukar dengan tips2 yg lain,,jd pas klian cba tips nhe kde thu dh gk ad,,,,

    ReplyDelete
  9. sob kode: 'data:label.url'
    gak ada capek udah ane cari ni..

    ReplyDelete
  10. cara untuk mengubah font (angka) nya menjadi lebih besar gimana? apa yang perlu dirubah?
    Untuk mengganti border-nya juga apa yang harus dirubah??

    ReplyDelete

Maaf Bukan Bermaksud apa,impian relugais12 hanya ingin memberi tahukan,setiap anda yang membaca artikel di atas tersebut,wajib mengisi post komentar anda di bawah ini,karna itu lbih memudahkan saya untuk mencoba apa yang kalian komentar,,,,
pliiiizzzzsssss NO SPAM,^_^,NO PORN

Add 'Q y Sobat Sxli'n

SmSan Yukxs

Make Widget

Link Keren

free web site traffic and promotion membuat blog terlihat berarti Free Link Exchange membuat blog terlihat berarti

Ayo Kita nonton TV live

Photobucket