Cara membuat daftar isi tab view otomatis sesuai label

Mau daftar isi seperti ini

Lihat Demo

Silahkan pasang script ini di blog kamu

<div dir="ltr" style="text-align: left;" trbidi="on">

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




<div id="tabbed-toc">

<span class="loading">Memuat...</span></div>

<script>

var tabbedTOC = {

blogUrl: "http://at4share.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></div>

Ganti yang berwarna merah dengan alamat atau url blog kamu

Simpan dan lihat hasilnya