Dalam sebuah buku ada yang namanya daftar isi.daftar isi ini berguna untuk menampilkan semua isi yang ada didalam buku tersebut.tentunya daftar isi ini akan sangat berguna sekali untuk pembaca.karena jika banyak tulisan dalam buku itu,mereka akan kesulitan mencari artikel jika mereka harus mencarinya satu persatu.daftar isi ini juga bisa anda tampilkan didalam blog,sehingga akan sangat memudahkan pembaca dalam mencari artikel dalam blog anda.jadi ketika ada pengunjung yang mengklik blog kamu maka akan tampil semua judul postingan beserta tanggal postingan.ok tanpa berlama lama,saya akan ajarkan cara membuatnya


A.langkah pertama 
1.sigin ke blogger
2.masuk ke layout-edit html...sebelum kita mengedit blog sebaiknya anda copy dulu semua code html anda ke notepad..supaya jadi backup kalo nanti kita gagal
3.copy kode dibawah ini tepat diatas kode ]]></b:skin>

#toc { border: 0px solid #000000; background: #ffffff; padding:2px; width:495px; margin-top:10px;}

.toc-header-col1, .toc-header-col2,

.toc-header-col3 { background: #B5CBFA; color: #000000; padding-left: 5px; width:250px;}

.toc-header-col2 { width:75px;}

.toc-header-col3 { width:125px;}

.toc-header-col1 a:link, .toc-header-col1 a:visited,

.toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link,

.toc-header-col3 a:visited { font-size:100%; text-decoration:none;}

.toc-header-col1 a:hover,

.toc-header-col2 a:hover,

.toc-header-col3 a:hover { font-size:100%; text-decoration:underline; color:#3D3F44;}

.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 { padding-left: 5px; font-size:100%; background:#f0f0f0;}

4.simpan template itu

B.langkah kedua
1.klik page element
2.tambah sebuah element halaman
3.tambah kode html/javascript
4.copy kode dibawah ini dan masukkan kedalam element halaman yang muncul

<div id="toc"></div>

5.letakkan element halaman tersebut tepat diatas element post6.kemudian simpan
7.tambahkan sebuah elemet halaman lagi
8.beri judul element halaman tersebut..bisa daftar isi atau terserah kamu
9.copy code dibawah ini dan masukkan kedalam element itu

<div id="toclink"><a href="javascript:showToc();"><img src="http://amen24.googlepages.com/folder.gif"/>
&nbsp;&nbsp;Lihat Daftar Isi !</a><br/><br/></div>
<script style="text/javascript" src="http://amen24.googlepages.com/daftarisi.js">
</script><script src="http://YOURBLOG.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>

ganti tulisan yang dicetak tebal dengan alamat blog kamu

10.letakkan element daftar isi tersebut ditempat dimana sering dilihat oleh pengunjung