Daftar Isi Blog dengan efek hover dan Style Horisontal

Daftar Isi adalah sebuah daftar yang mencantumkan spesifikasi sebuah Tulisan yang meliputi judul Tulisan dari kumpulan tulisan tersebut dan informasi lain yang terkait. Daftar Isi biasanya ditempatkan pada halaman Awal sebuah blog, disusun secara teratur dan berurutan berdasarkan abjad Sedangkan fungsi  salah satunya untuk memberikan referensi bagi pembaca blog tersebut untuk melakukan kajian ulang atau lanjutan sehubungan dengan tema blog. Juga sebagai bentuk penghargaan atau apresiasi terhadap penulis blog dalam Daftar Isi atas karyanya yang sudah mempunyai peranan dalam penulisan blog atau karya tulis.

Penyusunan Daftar Isi seharusnya mengedepankan asas kemudahan dalam

• Masuk ke account blog anda

• Tempatkan pada widget html baru

• Simpan di lihat hasilnya

<link rel="stylesheet" href="http://dte-project.googlecode.com/svn/trunk/tabbed-toc-skin.css"/>

<div id="tabbed-toc"><span class="loading">Memuat...</span></div>

<script>

var tabbedTOC = {

    blogUrl: "http://sanggar-belajar.blogspot.com", // Blog URL

    containerId: "tabbed-toc", // Container ID

    activeTab: 1, // The default active tab index (default: the first tab)

    showDates: false, // `true` to show the post date

    showSummaries: false, // `true` to show the posts summaries

    numChars: 200, // Number of summary chars

    showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)

    thumbSize: 40, // Thumbnail size

    noThumb: 
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC",
 // A "no thumbnail" URL

    monthNames: [ // Array of month names

        "Januari",

        "Februari",

        "Maret",

        "April",

        "Mei",

        "Juni",

        "Juli",

        "Agustus",

        "September",

        "Oktober",

        "November",

        "Desember"

    ],

    newTabLink: true, // Open link in new window?

    maxResults: 99999, // Maximum post results

    preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")

    sortAlphabetically: true, // `false` to sort posts by published date

    showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked

    newText: " - <em style='color:red;'>New!</em>" // HTML for the "New!" text

};

</script>

<script src="http://dte-project.googlecode.com/svn/trunk/tabbed-toc.js"></script>

• Ganti Yang Berwarna Merah dengan url blog anda
• Ganti Yang Berwarna biru dengan kata-kata anda sendiri
• Selamat Mencoba Semoga Berhasil

demo