Cara Membuat Daftar Isi Berwarna

Kali ini saya akan berbagi Tips dan Tutorial Blog yaitu Cara Membuat Daftar Isi Keren di Blog,daftar isi kali ini lain dari yang sebelumnya lebih bagus, keren dan praktis, juga bisa kamu bikin di Halaman Penuh.Jika kamu memasang Daftar isi kaya gambar di bawah ini maka akan tampil berupa Label nya setelah di Klik Judul Label nya maka akan terbuka bagian isi Label tersebut berupa judul posting nya.

Jika sobat berminat silahkan kamu Copy kode di bawah ini.

<style type="text/css">
#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/AVvXsEjvcoXwfXeNkhssJzMLLqhMs8ef7u-SqjzG5EwqwDXFYfoSslqn78-d6uwNtq3m6QI4OBHFs0gfozMurzH8XheO3YpgmmGnyR9zakDjF5be1jR1w4m4NM9F9zQDEYdr1i6TWWG3upclpXg/d/bg5.gif) repeat-y scroll left center #E7F7FB; padding:2px 0; border:1px solid #339DC6; } .dafis-label{ background:url(http://lh5.ggpht.com/_7Y9pl24WpQY/Ss37F0ZA9kI/AAAAAAAAB2k/c_ySi8QZg20/header_thumb%5B2%5D.jpg) 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:ccc; 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:#ccc; border-left: 5px #333 solid; padding-left: 5px; text-shadow: 0 1px 1px rgba(0,0,0,.3); }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
</script>
<script src="http://infonetmu.googlecode.com/files/Acc1.js" type="text/javascript">
</script>
<script src="http://blog-mas-agunk.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

Kamu ganti kode yang berwarna merah dengan alamat Blog kamu.
Kalau mau di Halaman Penuh.

• Pilih Posting Baru.
• Pilih Edit Html yang ada di samping Compose.
• Lalu copy kode yang di atas.
• Dan lihat hasilnya.