Desain Tampilan Daftar Isi Model Tab

Daftar isi merupakan rangkuman keseluruhan isi suatu halaman yang digambarkan dengan tampilan teks judul yang termuat pada halaman tersebut, sehingga dengan adanya daftar isi ini dapat memudahkan kita untuk mencari beberapa materi yang kita perlukan pada halaman tersebut. Jika pada blog daftar isi biasanya disertakan pada menu navigasi, bahkan ada beberapa blog yang membuat teks daftar isi dengan efek kedip untuk memberitahukan kepada pembaca bahwa pada menu itu terdapat semua artikel yang ada pada blog tersebut.

Category atau label akan bertindak untuk merangkum judul artikel jika pada blog, dan jika pada buku ini seperti halaman pemberitahuan dimana letak judul materi tersebut termuat, sehingga desain tampilan daftar isi ini dapat kita pisahkan antara label dan judul artikel.

Script berikut tidak jauh berbeda pada modifikasi model sebelumnya, perubahan hanya saya edit pada kode tab-nya saja, dan beberapa script saya tambahkan untuk menampilkan JUMLAH POSTING dan JUMLAH KOMENTAR yang terdapat pada blog Anda.

<div id="tabbed-toc">
<span class="loading">Loading...</span></div>
<script>
var tabbedTOC = {
    blogUrl: "http://URL-Anda.blogspot.com",
    containerId: "tabbed-toc",
    activeTab: 1,
    showDates: false,
    showSummaries: false,
    numChars: 200,
    showThumbnails: false,
    thumbSize: 40,
    noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC",
    monthNames: [
        "Januari",
        "Februari",
        "Maret",
        "April",
        "Mei",
        "Juni",
        "Juli",
        "Agustus",
        "September",
        "Oktober",
        "November",
        "Desember"
    ],
    newTabLink: true,
    maxResults: 99999,
    preload: 0,
    sortAlphabetically: true,
    showNew: 7,
    newText: " - <em style='color:red;'>New!</em>"
};
</script>
<script src="http://dte-project.googlecode.com/svn/trunk/tabbed-toc.js"></script>
<script type="text/javascript">
function showPostCount(json) {
    document.write(parseInt(json.feed.openSearch$totalResults.$t, 10));
}
</script>
<p><script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=showPostCount"></script> Total Posting &amp; <script src="/feeds/comments/summary?max-results=0&alt=json-in-script&callback=showPostCount"></script> Total Komentar</p>