1. login ke akun blogger anda
2. Pilih Rancangan lalu klik Tambah Gadget dan pilih HTML / JavaScript
3. Untuk memasang Daftar Isi dengan Scroll masukkan kode berikut :
<div style="background:#000; -moz-border-radius:30px;
-moz-box-shadow: -2px 20px 20px #000;
-webkit-box-shadow: -2px 20px 20px #000;
border:1px solid #111;
height: 265px; margin: 0px; overflow: auto; padding: 1px; width: 508px;">
<script src="http://generation-platinum.googlecode.com/files/kodesitemap.js">
</script>
<script src="http://dayatbintangdi.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script></div>
Kalau tidak berhasil silahkan gunakan script dibawah ini:
<div style="overflow:auto;width:430px;height:120px;padding:10px;border:1px solid #eee"><script style="text/javascript" src="https://sites.google.com/site/anggasonaanotherbestblog/javascript/daftar_isi_label_new_icon.js"></script><script src="http:/dayatbintangdi.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script> </div>
Kalau ingin mencoba daftar isi seperti Education for all silahkan coba script dibawah ini.
<div class='widget-content'> <style type="text/css">
.bgsGR_CommBox, .bgsGR_CommBox-cumulus, .Label .widget-content {background:#000 url(http://i964.photobucket.com/albums/ae124/gubhugreyot/Mart10/template-GR/bgwidget.jpg) bottom center repeat;border:5px groove #666;font:Droid normal;font-size:10px;color:#CCFFFF;border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;-o-transition:all 2s ease-in;-moz-transition: all 2s ease-in;-webkit-transition:all 2s ease-in;}
.bgsGR_CommBox-cumulus {float: left;margin: 5px; opacity: 0.2;filter:alpha(opacity=20);}
.Label .widget-content {margin: 20px auto;width: 285px;height: 250px;overflow: auto; opacity: 0.2;filter:alpha(opacity=20);}
.bgsGR_CommBox { overflow:auto;height:200px; padding:15px 10px 10px 0;opacity:0.1;}
.bgsGR_CommBox:hover, .bgsGR_CommBox-cumulus:hover, .Label .widget-content:hover{opacity:1.0; filter:alpha(opacity=100);}
.bgsGR_CommBox a{color:#cb5d03;font-size:12px;font-weight:bold;text-decoration:none;}
.bgsGR_CommBox a:hover{text-decoration:underline;color:#33FF00;font-style:normal;}
</style>
<p style="font-family:Staccato222 BT;font-size:22px;color:888;margin:10px;text-align:center;">Dafatr Isi</p>
<div class="bgsGR_CommBox">
<script src="http://generation-platinum.googlecode.com/files/kodesitemap.js">
</script>
<script src="http://dayatbintangdi.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script></div>
</div>
4. Tulisan yang berwarna PINK bisa diganti sesuai dengan lebar sidebar blog sobat, warna KUNING ganti dengan alamat blog sobat, berwarna BIRU warna backgroundnya, gantilah sesuka hati atau kosongikan ganti aja dengan kata none.
Kalau dari script script diatas tidak berhasil silahkan pergi mengunjungi tutorial cara membuat daftar isi otomatis melayang
Kalau dari script script diatas tidak berhasil silahkan pergi mengunjungi tutorial cara membuat daftar isi otomatis melayang
5. Buat yang suka Daftar Isi Dengan Efek Berjalan masukkan kode berikut :
<marquee direction="down" onmouseover="this.stop()" width="100%" onmouseout="this.start()" scrollamount="2" height="200"><br/><br/><script style="text/javascript" src="http://adesanusi.googlepages.com/daftar-isi.txt"></script><script style="text/javascript">var numposts = 100;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script><script src="http://dayatbintangdi.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&max-results=999&callback=showrecentposts"></script><br/><br/></marquee>
6. Seperti diatas, warna KUNING ganti dengan alamat blog sobat, warna PINK
untuk mengatur ketinggian. Silakan diutak-atik sendiri untuk
mendapatkan hasil yang maksimal yang sesuai dengan keinginan sobat
blogger mania.
7. Terakhir dan yang paling utama simpan dan lihat hasilnya.Semoga Bermanfaat, teruskan berkreasi
WARNING :
- Jangan Lupa Tinggalkan Komentar Anda, Komentar Anda sangat berguna demi kelangsungan Blog saya
- Do not Forget Leave Your Comment Your comments are very useful for the survival of my Blog