Cara Membuat Daftar Isi Blog

Halo sobat blogger semua pada postingan saya kali ini saya akan mempostingkan tips dan trik tentang blog nah tema postingan saya adalah bagaimana cara membuat daftar isi pada blog?
bagi anda yang masih kebingungan bagaimana cara membuat daftar isi pada blog terutama pada blogger pemula, tentunya masih agak bingung seperti saya dahulu. Kalo begitu anda dapat mengikuti cara-cara yang sudah saya tulis di bawah ini. Daftar isi blog memang sagat penting fungsinya adalah untuk membeberkan semua isi yang ada dalam blog kita, supaya mempermudah pengunjung blog dalam pencarian arcive pada blog kita. hampir semua blog mempunyai daftar isi, karena mereka para blogger ingin memanjakan pengunjung blog agar mereka  tidak kesulitan dalam mencari isi blog kita.

Langkah Pertama :

• Sign in di blogger
• Klik menu Layout
• Klik menu Edit HTML
• Klik link Download full template, silahkan save untuk backup data
• Copy paste kode CSS berikut di atas 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;}

• Klik tombol Simpan Templet

Langkah Kedua :

• Klik menu Elemen Halaman
• Klik tulisan Tambah sebuah Elemen Halaman
• Klik tombol Tambahkan Ke Blog di bawah tulisan JavaScript/HTML  
• Copy paste kode berikut ke dalam elemen yang muncul

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

•  Klik tombol Simpan
• Pindahkan elemen yang baru di buat tepat di atas elemen Post 
• Klik tombol Simpan yang berada di sebelah atas 
• Klik tulisan Tambah sebuah Elemen Halaman kembali
• Klik tombol Tambahkan Ke Blog di bawah tulisan JavaScript/HTML
• Beri judul elemen tersebut dengan yang kata yang sobat ke hendaki. Contoh : Daftar Isi Blog, kemudian copy paste kode berikut ke dalam kotak elemen

<div id="toclink"><a href="javascript:showToc();">Lihat Daftar Isi</a><br/><br/></div>
<script style="text/javascript" src="http://home.planet.nl/~hansoosting/downloads/blogtoc.js"></script>
<script src="http://YOURBLOG.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>

• Ganti tulisan YOURBLOG dengan nama blog sobat 
• Klik tombol Simpan
• Pindahkan elemen yang baru di buat ke tempat yang sobat sukai (sebaiknya di simpan disebelah atas)
• Klik tombol Simpan yang berada di sebelah atas
• Selesai

Kode yang terakhir di pasang merupakan kode asli yang di buat oleh hans dan tentunya semua hasil dari kode tersebut berbahasa inggris, baik itu judul , alert dan segala macamnya adalah berbahasa inggris, jika sobat menginginkan jadi berbahasa indonesia, kode di bawah ini sudah dimodifikasi javascrips nya sehingga akan menjadi berbahsa indonesia. Cara yang harus di lakukan sangatlah mudah, sobat tinggal mengganti kode terakhir yang di pasang dengan kode di bawah ini :

<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>