Rabu, 03 Oktober 2012

Cara Membuat Daftar Isi Blog Otomatis

CARAMEMBUAT DAFTAR ISI BLOG OTOMATIS

<div style="background: #f2f2f2; width: 320px; color: #000; float: center; font: normal 13px verdana; height: 350px; margin: 10px auto; overflow: auto; padding: 10px; text-align: left; text-shadow: 1px 1px 2px #fff; border:4px double #ccc; -moz-box-shadow: inset 2px 2px 2px #404040; -webkit-box-shadow: inset 2px 2px 2px #404040;box-shadow: inset 2px 2px 2px #404040">
<div id="cl_option">
Masih loading bro... sabar ya... </div>
<div id="cl_content_list">
</div>
<script type="text/javascript">
var jumlah_kata_dalam_ringkasan =200;
</script>
<script type="text/javascript" src="https://sites.google.com/site/bloggerbugisdotkom/javascript/Dafatar_isi_Biasa_Bloggerbugis.js">
</script>
<script type="text/javascript" src="http://www.masterbis.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=onLoadFeed&amp;max-results=500">
</script>
<div style="float:right;font:normal 10px verdana; color:#ccc;text-align:right;padding:5px 0px;text-shadow:1px 1px 1px #000">
Widget by <a href="http://www.bloggerbugis.com">Blogger Bugis</a></div>
</div>

Kode di atas bisa di edit untuk menyesuaikan tampilannya dengan tema blog anda.
Perhatikan kode yang berwarna merah !!!
  • f2f2f2 adalah kode warna background ( Warna Latar Belakang ) yaitu Abu - Abu. Ganti kode tersebut dengan kode warna yang anda inginkan untuk mengganti warna background widget Daftar Isi Otomatis.Untuk melihat kode warna HTML, silahkan klik "Daftar Kode Warna HTML".
  • 320px adalah Kode lebar widget. Ganti dengan angka yang lebih besar untuk membuat widgetnya lebih lebar atau ganti dengan angka yang lebih kecil untuk membuat widgetnya lebih sempit. Misalnya 300px atau 350px.
  • 000 adalah kode warna tulisan yaitu hitam. Silahkan ganti dengan warna yang anda inginkan. Adapun warna Link yang ada di dalam widget, tergantung dari pengaturan CSS template anda.
  • 4px double adalah kode ketebalan garis pinggir widget, yaitu garis pinggir ganda ( double ) dengan ketebalan 4 piksel ( 4px ) . Ganti dengan angka 4 yang lebih besar atau lebih kecil. untuk membuat hanya 1 garis pinggir, ganti double dengan solid, untuk membuat garis pinggir putus - putus, ganti dengan dashed
  • ccc adalah kode warna garis pinggir, ganti dengan kode warna yang anda inginkan.
  • Masih loading bro... Sabar ya.... adalah kalimat yang di tampilkan jika widgetnya belum terbuka karena halaman masih loading. Silahkan ganti dengan kalimat yang anda inginkan.
  • 500 adalah jumlah maksimal judul artikel yang akan di tampilkan di dalam widget daftar isi otomatis. Ganti dengan angka yang lebih besar atau lebih kecil. Pada live demo yang anda lihat di atas, saya hanya menggunakan 15.
  • Yang terakhir dan paling penting adalah kode http://www.masterbis.blogspot.com. Ganti kode tersebut dengan URL / Alamat blog anda
Dengan mengedit semua kode di atas, anda akan memiliki daftar isi blog yang sesuai dengan tema warna blog anda. Silahkan pasang widgetnya pada sidebar blog atau laman atau halaman blog Anda. Sumber: www.bloggerbugis.com

11 komentar:

  1. Thanks Gan udah di pasang di blog http://gudang2share.blogspot.com

    BalasHapus
  2. okee gann ane coba pasang..
    simpel dan bermanfaat.
    bisa buat nga yang tidak pake js?

    BalasHapus
  3. Thanks buat info ya.....coba diterapkan

    BalasHapus
  4. sebelumnya maaf ya saya bawa pertanyaan :(
    cuma mau nanya "Masih loading bro... sabar ya... " itu termasuk kode script atau ada kesalahan?
    from:
    jonarendra.blogspot.com

    BalasHapus
    Balasan
    1. "masih loading bro..sabar ya.." ini bukan kode script bro..hanya sebagai kata pembuka saja,bisa di ganti dgn kata2 yang di inginkan

      Hapus
  5. thanks ea,,, nih dah w coba,,



    BalasHapus
  6. Ok bro... makasih Cara Membuat daftar isinya, bermanfaat sekali akhir...

    BalasHapus
  7. terima kasih sudah berbagi sob, salam kenal...

    BalasHapus
  8. Mantap tipsnya bro, sangat bermanfaat... berhasil di pasang di Blog saya...Kunjungan balik

    http://www.bmatindas.com

    BalasHapus