cara membuat daftar isi

dulu ketika aku menduduki bangku smp,aku pernah membeli sebuah buku yg memang dasar apes buku tersebut tidak mempunyai daftar isi,sehingga ketika aku mencari pelajaran yang aku perlukan terpaksa deh ludah saya jadi habis dan bibir tambah doer,jadi susah bangat deh buku tanpa daftar isi,nah berbekal dari pengalaman itu admin sendiri membuat tutorial tentang daftar isi yang berguna untuk menampilkan semua artikel di blog kita dan untuk membuat para tamu blog kita betah-betah di blog kita,satu lagi paman engine juga suka kalau kita membuat widget daftar isi di blog kita,oke bro kira-kira demikianlah kegunaan daftar isi yang akan kita bahas saat ini,mari kita langsung ke tkpnya

1.login ke akun blogger anda
2.pilih menu template,kemudian pilih edit HTML
3.centang expand widget template
4.kemudian cari kode ]]></b:skin>
,kemudian copas dan pastekan script di bawah ini tepat di atas kode tadi

/* Daftar Isi With JQuery */ #dafis-acc{ font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#333; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5nyVo6IEForNarfxiI_0Pcsr-Xssf3t2GSkvk0skqkQn5gS6b0h3Fg3kTG_fqkqcEW42iF6YewWVJxgvRjosokl-9lhlsFRsrPuhEAFRPyLwaDrb44RhjNuVagovK70L32ycaYSwnaVs/s320/bg5.gif) repeat-y scroll left center #E7F7FB; padding:2px 0; border:1px solid #339DC6; } .dafis-label{ background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJf4YSM_ChuCpSwuPg1ZOt_1YsmvYWt3I9SFvvwF5rYiZpEx6dnpHHsUghjUe1YwXTY1t4c2pkBUJ9npFfHnT2acw3MPbc7WwcJWGPjVgOMHUab7I7nDVzS4i8Pe53xoY1TDE4yAr7BT4/s1600/bg4.gif) repeat-x scroll 0 0 #E1F4FB; font-weight:bold; line-height:1.4em; overflow:hidden; white-space:nowrap; vertical-align: baseline; margin: 1px 3px; outline: none; cursor: pointer; text-decoration: none; padding: 2px 10px; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.3); border:1px solid #2F94BA; } .dafis-label:hover{ background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxdGkL3AVpX0EvYszxMdZmvGcoiS5qDQmpD-3Z72Bl27sWkgEXDc5Mxjr8oLxO-3OXKsX4YvGuWyL4IROBokO_DLjvf5DNWNnYXoOx6iojaBEdLvoLymDvmCfHenwiGTcLyarrg_-Y9Ms/s320/bg2.gif) repeat-x scroll 0 0 #E1F4FB; color:#003366; } .dafis-daf ol{ margin:0 0 0 30px !important; padding:0 !important; } .dafis-daf ol li{ background-color:#C9E9F4; line-height:1.5em; margin:1px 3px !important; white-space:nowrap; text-align:left; border:1px solid #339DC6; } .dafis-daf ol li a{ text-decoration: none !important; color:#333 !important; display:block; padding-left:10px; } .dafis-daf ol li a:hover{ background: #7BC4DF; border-left: 5px #333 solid; padding-left: 5px; text-shadow: 0 1px 1px rgba(0,0,0,.3); }

4.kemudian cari kode </head> dan masukkakn javascript di bawah ini tepet di atas kode </head> tadi

<script src='http://togeljitu.wapgem.com/js/daftarisi1.js' type='text/javascript'/>

5.setelah itu save templatenya dan closekan

6.nah untuk tahap akhirnya masuk ke postingan anda dan pada halaman edit HTML nya masukkan kembali javascript di bawah ini,dan buat judulnya umpamanya daftar isi terserah anada mau buat judulnya apa,oke gan ini dia javascriptnya
<script type="text/javascript" src="http://togeljitu.wapgem.com/js/daftarisi.js"></script> <script src="http://joringta1.blogspot.com/feeds/posts/summary?max-results=1000&alt=json-in-script&callback=loadtoc"></script>

keterangan: tulisan yang berwarna merah joringta1.blogspot.com ganti dengan alamat blog agan,oke gan demikianlah tutorial kita kali ini,selamat mencoba dan semoga bermanfaat