Cara Membuat Daftar isi (posting) Blog

Daftar isi blog, yaitu konten atau macam-macam judul posting yang kita terbitkan, dan tersimpan dalam folder blog. Hal ini sangat penting sekali karena dengan ditampilkannya daftar isi, pembaca bisa tahu, konten apa saja yang dimuat di halaman blog yang telah dipostingkan oleh pemiliknya. Disisi lain, hal ini akan sangat memudahkan pengunjung yang datang ke blog kita, untuk melihat serangkaian jenis postingan yang kita terbitkan.
lalu, bagaimana cara membuat daftar isi tersebut? oke, caranya seperti ini:

Versi Pertama:

Langkah Pertama:
1.Login ke Blogger kemudian ke Layout/Tata Letak
2.Pilih Edit HTML
3.Copy kode berikut ini:

<em>#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;}
.</em>

4.Taruh kode tadi di atas kode ]]></b:skin>
5.Simpan pengeditan yang sudah dilakukan

Langkah Kedua:
1.Pilih Layout/tata letak pada blogger
2.Pada menu Elemen Halaman, tambah gadget di sebelah atas elemen Post
3.Pilih HTML/Javascript dan paste kode di bawah ini ke dalamnya:

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

4.Simpan tanpa judul
5.Jika sudah klik Tambah Gadget lagi dan posisinya bisa Anda tentukan
6.Paste kode berikut pada konten HTML/Javascript

<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 halaman berwarna merah dengan alamat blog anda.

7.Beri judul gadget dengan Daftar Isi atau bisa dengan kalimat Anda sendiri
8.Klik tombol Simpan dan lihatlah hasilnya

Versi pembuatan daftar isi yang ke dua yaitu:

Dasbor--->Layout--->Edit HTML
1.Klik Expand Template Widget terus cari kode berikut ini:
<b:include data='post' name='post'/>

2.Ganti kode tadi dengan kode di bawah ini:
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<a expr:href='data:post.url'>
<div style='padding:6px 0 6px 5px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;margin-bottom:2px;background:#EAE9E9;color:#406A0E;'>
<data:post.title/></div></a>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

4.Paste kode berikut ke dalam content:

<a href="http://NamaBlogAnda.blogspot.com/search?max-results=200">Daftar isi&raquo;</a>

5.Ganti kode berwarna merah dengan URL Blog anda
6.Klik Simpan
7.Anda juga bisa menempatkannya pada Navbar atau manapun, tinggal copy URL berikut ke dalamnya: http://NamaBlogAnda.blogspot.com/search?max-results=200

Dan lihat hasilnya, bagaimana? berhasil??

Related Post