Membuat daftar isi blog

                Sebenarnya hari ini saya lagi ga enak badan mungkin karena habis latihan jogging kemarin,terasanya baru sekarang. O yah sekarang kita belajar membuat daftar isi blog dengan 1 klik saja maka semua judul postingan kita akan muncul dan untuk menyembunyikan kembali tinggal klik lagi.Hal ini akan memudah pembaca blog kita untuk memilih artikel yang menarik untuk dibacanya.Langsung aja ya
 

Langkah Pertama:
1. Sign in di blogger


2. Klik menu Layout


3. Klik menu Edit HTML


4. Klik link Download full template, silahkan save untuk backup data


5. Copy paste kode CSS berikut di atas kode ]]></b:skin> 

#toc {  border: 0px solid #000000;  background: #ffffff;  padding:2px; width:495px;  margin-top:10px;}<br /><br />.toc-header-col1, .toc-header-col2,<br /><br />.toc-header-col3 {  background: #B5CBFA;  color: #000000;  padding-left: 5px;  width:250px;}<br /><br />.toc-header-col2 {  width:75px;}<br /><br />.toc-header-col3 {  width:125px;}<br /><br />.toc-header-col1 a:link, .toc-header-col1 a:visited,<br /><br />.toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, <br /><br />.toc-header-col3 a:visited {  font-size:100%;  text-decoration:none;}<br /><br />.toc-header-col1 a:hover, <br /><br />.toc-header-col2 a:hover,<br /><br />.toc-header-col3 a:hover {  font-size:100%;  text-decoration:underline; color:#3D3F44;}<br /><br />.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {  padding-left: 5px;  font-size:100%; background:#f0f0f0;}<br />

6 Klik tombol SIMPAN TEMPLATE


Langkah kedua :

1. Klik menu Elemen Halaman


2. Klik tulisan Tambah sebuah Elemen Halaman


3. Klik tombol TAMBAHKAN KE BLOG di bawah tulisan JavaScript/HTML


4. Copy paste kode berikut 

  

</div><br />

5. Klik tombol Simpan


6. Pindahkan elemen yang baru di buat tepat di atas elemen Post


7. Klik tombol Simpan yang berada di sebelah atas


8. Klik tulisan Tambah sebuah Elemen Halaman kembali


9. Klik tombol TAMBAHKAN KE BLOG di bawah tulisan JavaScript/HTML


10. Beri judul elemen tersebut dengan yang kata yang sobat ke hendaki. Contoh : DAFTAR ISI, kemudian copy paste kode berikut ke dalam kotak elemen

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

11. Ganti tulisan YOURBLOG dengan nama blog sobat


12.Klik tombol Simpan


13. Pindahkan elemen yang baru di buat ke tempat yang sobat sukai (sebaiknya di simpan disebelah atas)


14. Klik tombol SIMPAN yang berada di sebelah atas


15. 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, Kang Rohman sudah memodifikasi javascrips nya sehingga akan menjadi berbahsa indonesia seperti milik saya. Cara yang harus di lakukan sangatlah mudah, sobat tinggal mengganti kode terakhir yang di pasang dengan kode di bawah ini : 

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

Jangan lupa untuk mengganti tulisan YOURBLOG dengan nama blog sobat.

Selamat mencoba !