Daftar Isi Lengkap Dengan Tabel

Membuat daftar isi dari sebuah blog sudah banyak ditulis di berbagai blog tutorial. Hanya saja, sebagian dari cara yang dikemukakan tidak menampilkan seluruh daftar isi yang ada pada blog.
Tips kali ini juga merupakan cara membuat daftar isi blo secar lengkap yang ditampilkan dalam bentuk tabel. Kelebihan dari daftar isi ini dapat ditampilkan dan juga dapat disembunyikan, anda tinggal klik kata untuk menampilkan atau menyembunyikan daftar isi.
Post ini diperoleh dari sumbernya aslinya yaitu : BEAUTIFUL BETA
Ikuti langkah-langkah dibawah ini bagi kawan yang ingin mencoba.

* Langkah Pertama
1. Masuk ke Blogger dengan ID anda.
2. Pilih Tata Letak.
3. pilih Edit HTML.
4. Back up dulu templatnya jika takut gagal.
5. Cari kode ini : ]]></b:skin>
6. Copy kode dibawah ini, kemudian paste tepat diatas kode tadi.

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

7. Klik Tombol Simpan Template
* Langkah Kedua
1. Masuk ke Elemen Halaman.
2. Pilih Tambah Gadget.
3. Klik tanda + pada HTML/JavaScript.
4. Copy kode dibawah ini kemudian paste pada kolom yang tersedia

<br /> <div id="toclink"> <a href="javascript:showToc();"> <img border="0" src="http://h1.ripway.com/ades40/image/add2.png"/><font color="#808000"><b> Lihat Semua Daftar Posting</b></font></a><br /> </div><br /> <script style="text/javascript" src="http://h1.ripway.com/ades40/blogtoc.js"></script><br /> <script src="http://namablog anda.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>

5. KLik tombol Simpan

* Langkah Ketiga

1. Masih di Elemen Halaman.
2. Klik Tambah Gadget.
3. Klik tanda + pada HTML /JavaScript.
4. Copy kode dibawah ini, kemudian paste pada kolom yang tersedia.

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

5. Klik tombol Simpan

* Selesai.
* Selamat mencoba, semoga bermanfaat.