Cara Mudah Membuat Widget Daftar Isi Di blog

Membuat widget Daftar isi di Blog - Membuat Widget daftar isi atau sitemap di blog sangat  berguna untuk memudahkan pengunjung blog anda menemukan artikel yang mereka cari. Untuk membuat Sitemap atau daftar isi di blog cukup mudah ikuti tutorial berikut.

1. Pertama Login ke Blogger anda
2. Setelah itu pilih Laman ( Page )

3. Buat Laman Baru lalu beri Judul " Daftar Isi " atau " Sitemap "
4. Lalu Pilih Kolom HTML

5. Lalu Pastekan Kode Berikut .

<div dir="ltr" style="text-align: left;" trbidi="on">
<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/AVvXsEi8yk5yBb-fTbcyOe7W_0yuPeO-PKumtTQF8NVbir69nIrDK50fniqzTA-ElSf4R0pXtSfoJHwNkI-Q0d0kba9QOvjSsQ_lSunRojPPPE1sZRrAdpraX2-v0743f8b_j501H660QOyrSBY/d/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/AVvXsEgIRKtEGyNTdupX-vC7cRsFELm3jrpGPLYJUZxITbecTXB8OPhj8EQ-yI4pX-EROx4cDrXKO0LBzmk45DfLP6JLLZsUvEtKL2PVVG2I6tob6bwdL9NiroQjyDDdylwZx3I7juVTjFVhaWM/d/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/AVvXsEj_XAABc3qKWDrdYmbVVyzShByFBBKbUXHoBtw-jBwr5oHMR0Q8YA65F0D4TRWhf3u4oJwAWxOBrxaAn8tglUeAPbTz9lIE1u5QG1S05T_aO7skFUu6Pv5o0hFvYqbpXb6ClQum1brcjRg/d/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); }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script src="https://farhanshare-blogspot-com.googlecode.com/files/sitemap%20%281%29.js" type="text/javascript"></script><script src="http://erdystev.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>
</div>
<span style="font-size: x-small;"><a href="http://erdystev.blogspot.com/2014/06/cara-mudah-membuat-widget-daftar-isi-di.html" target="_blank">Get This Widget</a></span>

Ganti tulisan yang berwarna Biru dengan Alamat blog anda . setelah itu simpan lalu lihat hasil nya .
Contoh hasilnya lihat disini : Daftar Isi