Langkah-langkah Membuat daftar isi dengan scrollbar :
1.Sign blog anda.
2.Klik Design.
3.Klik Add a Gadget.
4.Klik HTML / Javascript.
5.Copy kod dibawah ini, paste pada kotak HTML / Javascript.
Daftar isi mengunakan icon :
<style>
.list {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA8qpIqh0JfNBXuQ0lLVwOuVUj4ACl0spLE4-dHrEi3_5PY3cM-PUBjfYIIvyDXhJdu36gbc0vNL3iqSyDn99FNwpw0qtr5Q9uLBWkGQh6f-dpDl29obbxxQSwVmomw2lh4Iq2vCXkWaLL/") no-repeat left center;border-bottom:1px dotted #ddd;line-height:1.2em;padding:3px 0px 0px 20px;
}
</style>
<div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:284px; height:180px; background-color: #ffffff; border:1px solid #ffffff;">
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/10-gejala-narsis.html">10 Gejalan Narsis</a></div>
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/10-password-terpopuler-di-dunia.html">10 Password Terpopuler di Dunia</a></div>
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/wasiat-wasiat-aneh-di-dunia.html">Wasiat-Wasiat Aneh di Dunia</a></div>
</div>
.list {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA8qpIqh0JfNBXuQ0lLVwOuVUj4ACl0spLE4-dHrEi3_5PY3cM-PUBjfYIIvyDXhJdu36gbc0vNL3iqSyDn99FNwpw0qtr5Q9uLBWkGQh6f-dpDl29obbxxQSwVmomw2lh4Iq2vCXkWaLL/") no-repeat left center;border-bottom:1px dotted #ddd;line-height:1.2em;padding:3px 0px 0px 20px;
}
</style>
<div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:284px; height:180px; background-color: #ffffff; border:1px solid #ffffff;">
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/10-gejala-narsis.html">10 Gejalan Narsis</a></div>
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/10-password-terpopuler-di-dunia.html">10 Password Terpopuler di Dunia</a></div>
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/wasiat-wasiat-aneh-di-dunia.html">Wasiat-Wasiat Aneh di Dunia</a></div>
</div>
Daftar isi menggunakan angka:
<style>
.list {
border-bottom:1px dotted #ddd;
line-height:1.2em;
padding:3px;
}
</style>
<div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:284px; height:180px; background-color: #ffffff; border:1px solid #ffffff;">
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/10-gejala-narsis.html">10 Gejalan Narsis</a></div>
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/10-password-terpopuler-di-dunia.html">10 Password Terpopuler di Dunia</a></div>
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/wasiat-wasiat-aneh-di-dunia.html">Wasiat-Wasiat Aneh di Dunia</a></div>
<div class="list">
</div>
.list {
border-bottom:1px dotted #ddd;
line-height:1.2em;
padding:3px;
}
</style>
<div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:284px; height:180px; background-color: #ffffff; border:1px solid #ffffff;">
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/10-gejala-narsis.html">10 Gejalan Narsis</a></div>
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/10-password-terpopuler-di-dunia.html">10 Password Terpopuler di Dunia</a></div>
<div class="list">
<a href="http://aris-unik-menarik.blogspot.com/2011/04/wasiat-wasiat-aneh-di-dunia.html">Wasiat-Wasiat Aneh di Dunia</a></div>
<div class="list">
</div>
Catatan:
380px merupakan lebar kotak, 180px merupakan tinggi kotak, #ffffff pada background-color merupakan warna background, dan #ffffff pada border merupakan warna garis tepi. Silakan ganti mengikut sesuai dengan template anda.
Gantikan perkataan yang berwarna Merah dengan alamat postingan anda dan ganti tulisan berwarna Biru yang dengan tajuk posting anda.
Gantikan yang berwarna hijau sesuai keingiann anda. Width=Lebar dan Height=Panjang
Bisa diletakkan dimana saja: diatas, dibawah, atau bahkan di dalam postingan.
Jika anda ingin menambah posting baru, copy kode dibawah ini dan paste sebelum kode </div>.
<div class="list">
<a href="alamat link yang ingin dituju"> tajuk posting </a></div>
6. Save
Demikian langkah untuk membuat daftar isi pada blog dengan scrollbar, semoga bermanfaat dan selamat mencoba.