Membuat Daftar Isi Blog Pada Halaman Artikel (Bag. II)

Pada tulisan sebelumnya telah dibahas mengenai dua buah model daftar isi (table of content) hasil olahan Master Blogger, Abu Farhan. Nah, pada tulisan bagian kedua ini akan dibahas mengenai daftar isi yang dapat menampilkan secara keseluruhan, per-kategori, atau pertanggal, seperti dapat dilihat pada Daftar Isi SC Community.

Daftar isi ini merupakan hasil olahan seorang blogger muda asal Makasar, Copycat91. Kelebihan lain dari daftar isi ini adalah bisa melihat ringkasan, atau lebih tepatnya melihat paragraf awal, dari sebuah artikel (jumlah karakternya bisa kita tentukan sendiri), sehingga dapat menarik pembaca untuk mengetahuinya lebih lanjut.

Untuk membuat daftar isi ini mirip dengan cara membuat daftar isi pada bagian ke-1, hanya pada script-nya saja yang berbeda. Untuk lebih jelasnya kamu dapat mengikuti langkah-langkah berikut:
  • Login ke Blogger.
  • Kemudian buat sebuah Entri Baru atau Laman Baru dan pilih Edit HTML.
  • Berilah judul, misalnya: Daftar Isi.
  • Jika memilih Entri Baru, klik pada Opsi Entri dan setting supaya dipublikasikan mundur (ke tanggal pertama kali kamu posting).
  • Kopikan script berikut (gunakan Control C) dan ganti NamaBlog sesuai nama Blog kamu:

    <div id="cl_option"> Loading... </div>
    <div id="cl_content_list"></div>
    <script type="text/javascript">var jumlah_kata_dalam_ringkasan = 500;</script>
    <script src="http://enes-sc.googlecode.com/files/blogtoc-v3.js"></script>
    <script src="http://NamaBlog.blogspot.com/feeds/posts/default?alt=json-in-script&callback=onLoadFeed&max-results=9999"></script>
    Oya, kamu juga dapat mengubah jumlah karakter ringkasannya tidak 500. Misalnya dengan: 200, 300, 400, 600, dst.
  • Setelah di-paste, klik Terbitkan Entri dan ucapkan Alhamdulillah...

Seperti pada pembuatan daftar isi bagian I, kamu juga harus membuatkan link untuk daftar isi ini yang bisa kamu tempatkan di navbar menu atau di sidebar. Link-nya misalnya seperti ini (jika memilih entri baru):

<a href="http://NamaBlog.blogspot.com/2009/03/daftar-isi.html">Daftar Isi</a>
atau seperti ini (jika memilih laman baru):

<a href="http://NamaBlog.blogspot.com/p/daftar-isi.html">Daftar Isi</a>

Selain itu kamu juga dapat menambahkan perintah overflow supaya tidak terlalu memanjang jika jumlah artikel pada blog kamu sudah banyak, misalnya seperti ini:

<div style="overflow:auto; border: 1px solid #CCC; margin:0px; padding:10px; width:auto; height:500px; background-color:#F0F0F0; text-align:left;">Script Yang Dikopikan</div>

Ok coy, selamat mencoba....

Categories: Share

Leave a Reply