Pemasangan daftar isi pada blog yang diletakkan pada posisi sidebar ataupun pada footer widget tidaklah sulit. untuk lebih jelasnya silahkan ikuti langkah cara membuat daftar isi di blog berikut ini :
- Silahkan login ke dasbor blog terlebih dahulu.
- Klik panah kebawah seperti pada gambar yang diberi kotak merah :
- Pilih >> Layout (Tata Letak)
- Kemudian akan muncul halaman seperti gambar berikut ini :
- Pilih Add Gadget (Tambah Gadget)
- Pilih HTML/Javascript Untuk memasang Kode HTML Widget.
- Masukkan judul yang sobat inginkan pada kolom judul, misalnya saja "Daftar Isi"
- Copy-paste kan kode dibawah ini pada kolom yang tersedia (bukan kolom judul)
<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/AVvXsEigX0IEjxj4GSYAkipvC3BrCpZ9dwzWPPIiAaTh1ynVeZnZdXDi0f3Z2UW8oZqz_IbYe0npnVv-BAjugPVR5CoUNfqtIHLag3dM5KlZBC0qCwAdR77v3deV5qGRYDXgvnN1wwX-mghPlnU/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/AVvXsEilYc3trFMLMehXRXgCklecYuTeebKGx3gFeDhMcBJaB0GijbBZCXsN84ySLisD1E6zv4HOvjrtcgJkWiSpY1fmB9n7KGpULs9VcTfeYj5bk00gYX_BUI74c1y5CiQYyGyrDQvErBPLJhE/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/AVvXsEhaWMGVtHHvJ8oCzhYN-LliFRZcd_M2CtX1XApZhqAfpGlF2UX6ScIsAf_WG2FNxQbcgh8lcgtCBFiWJL0ipSYH72_kxcIBq4yN6FhHr8MbBlKt2CiLp_7bvPZzdw8YOHC44f1VAI-BAhg/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 type="text/javascript" src="http://infonetmu.googlecode.com/files/Acc1.js"></script>
<script src="http://waroenkblog.blogspot.com/feeds/posts/summary?max-results=1000&alt=json-in-script&callback=loadtoc"></script>
- Silahkan sobat ganti kode link berwarna merah diatas dengan link URL blog sobat.
- Setelah sobat ganti kemudian save (simpan) pengaturan sobat dan lihat hasilnya pada homepage blog sobat.
Komentar
Posting Komentar
Komentar yang baik ya