Cara membuat Daftar Isi Otomatis di Blog versi 2

Senin, 07 November 2011

setelah dulu saya sudah pernah mosting tentang Cara membuat Daftar Isi Otomatis di Blog kali ini saya akan membahas hal yang sama tapi daftar isi yang satu ini lebih bagus dari sebelumnya screenshotnya disebelah kanan(klik untuk memperbesar) oke deh kalo udah penasaran langsung aja kita mulai tapi sebelum itu follow blog saya dulu dong kalo udah follow kita mulai:

1.Login ke akun blogger anda
2.Pilih tab rancangan
3.Pilih Edit html
4.Cari kode <b:skin><![CDATA[ (gunakan f3 agar lebih mudah mencari)
5.Kalo udah ketemu letakkan kode dibawah ini dibawah kode <b:skin><![CDATA[

.judul-label{background:-moz-linear-gradient(top,#393e41,#000);font-weight:bold;line-height:1.4em;margin-bottom:5px;overflow:hidden;vertical-align:baseline;margin:0 2px;outline:none;cursor:pointer;text-decoration:none;font:14px/100% Arial,Helvetica,sans-serif;padding:.5em 2em .55em;text-shadow: 1px 1px rgba(0,0,0,.3);-webkit-border-radius:.5em;-moz-border-radius:.5em;border-radius:.5em;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);-moz-box-shadow:1px 1px 4px #aaa;box-shadow: 1px 2px rgba(0,0,0,.2);color:#e9e9e9;border:2px solid white !important;background:#0000fff }.judul-label,.data-list{white-space:nowrap}.data-list{font:12px comic sans ms /1.5em;margin-:5px;padding-left:20px;15px;text-align:left;left}.list-ganjil,.list-genap{background:#000;color:#51a104;border-top:1px solid #f00;border-bottom:1px solid #f00}.headactive,.headactive{color:#fff;border:2px solid:#c0c0c0;!important;background:#d11717;background:-moz-linear-gradient(top,#d11717,#8c0000)}

6.kalo udah tinggal di simpan deh



LANGKAH INI BELUM SELESAI MASIH ADA LANGKAH SELANJUTNYA

untuk memanggil kode tersebut kita harus membuat sebuah postingan baru ikuti langkah-langkah berikut:

1.Login ke akun blogger anda
2.Pilih tab entri baru
3.Pilih Edit html

masukkan kode dibawah ini dikotak yang telah disediakan

<script src="https://sites.google.com/site/webmiftah/js/wm2.js">
</script>
<script src="http://webmiftah.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc">
</script>
<script type="text/javascript">
var accToc=true;
</script>
<script src="https://sites.google.com/site/webmiftah/js/wm.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/webmiftah/js/wm3.js" type="text/javascript">
</script>

kalo udah tinggal di terbitkan deh

contoh bisa dilihat disini

keterangan:kode yang berwarna biru ganti dengan url blog anda

SELAMAT MENCOBA
Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di webmiftah.blogspot.com

24 komentar:

  1. sip, kira2 ada contohnya gak gan?

    BalasHapus
  2. @ALI BLOGGERS:ada gan dibagian awal yang gambarnya kayak list itu kalo gambarnya kurang besar bisa diklik biar lebih jelas

    BalasHapus
  3. sip tp punyakku kayaknya udah ada.
    berkunjung kesini sob

    BalasHapus
  4. kok saya gak bisa. tulisanya ada kode javaScrips kurang lengkap..

    BalasHapus
  5. @Sriwijaya City;ah masak sih gan kok yang lain bisa? mungkin ada langkah yang salah gan

    BalasHapus
  6. Salam kenal n sukses slalu...Gan saya seorang pemula blog...Jika bisa saya ingin agar template blog saya sama kayak blog ini...Jika agan bersedia saya sangat senang sekali n berapa biaya nya?...MOHON TANGGAPANNYA-SEBELUM NYA SAYA UCAPKAN BANYAK TERIMAKASIH...(Chat YM Kita_bisa7 E-mail kita_bisa7@yahoo.com)

    BalasHapus
  7. @www.kita-bisa.com:oh kalo template ini saya mengeditnya sendiri

    BalasHapus
  8. @Sriwijaya City:oh maaf gan saya lupa ada kode yang belum saya ubah sekarang udah saya pebaiki

    BalasHapus
  9. Wah sekian lama sy berkomentar, Rupanya baru ketahunan sekarang ya masalah nya, Ya namanya manusia gan,,,haha..

    BalasHapus
  10. Oya Sriwijaya City ama INTERNET OKE itu sama..

    BalasHapus
  11. @INTERNET OKE:o orang yang sama ya
    ya nih gan yang mau buat postingan buru-buru sampai belum dicek kalo ada kesalahan

    BalasHapus
  12. ada trik untuk buat tag cloud di blogspot nggak gan ?

    BalasHapus
  13. @habib ihza:ah yang boneng gan
    maaf kalo telat balesnya

    BalasHapus
  14. saya sudah coba beberapa tips tentang daftar isi...tapi kenapa gak pernah berhasil y mas???tulisannya muncul, tapi gak tertata rapi gtu mas...

    BalasHapus
    Balasan
    1. mungkin kamu ada langkah yang kurang coba teliti ulang
      karna dulu saya juga pernah coba trik ini tapi ada langkah yang kurang makanya jadi gak tertata rapi
      kamu coba cek dulu :D

      Hapus

Posting Komentar