Cara Membuat Daftar Isi Seperti Blog Kang Ismet

Halo semua, hari ini saya admin RTE akan membuat posting tentang : Cara Membuat Daftar Isi seperti Blog KangIsmet.net.
Pasti disini pernah ada yang pergi ke blog kangismet.net kan, dan kalian pasti pernah mengintip daftar isi blog Kang Ismet, keren bukan, ya sangat keren sekali dan responsive.



LANGKAH

1. Login di blog anda masing masing.
2. Pegi ke menu halaman
3. Buat halaman baru

4. Jangan lupa untuk mengganti jenis compose menjadi HTML

5. Lalu copy script di bawah ini :

<style scoped="scoped" type="text/css"> 
/* Basic Skin for Multi Feed Loader */ 
.list-entries{background:white;border:1px solid #d8d8d8}
.list-entries ul,.list-entries li{margin:0;padding:0;list-style:none}
.list-entries li{padding:1em;border-bottom:1px solid #ddd}
.list-entries .main-title{padding:0}
.list-entries .main-title h4{display:block;font:inherit;font-weight:bold;padding:.5em 1em;background-color:#4f93c5;color:#fff;margin:0;line-height:normal;font-size:12px;margin-top:0 !important}
.list-entries .title a{font-weight:300;font-size:14px;text-decoration:none;line-height:.5em;color:#222}
.list-entries .title a:hover{text-decoration:underline;color:#5886a7}
.list-entries img,.list-entries .fake-img{border:none;background-color:#333;margin:0 1em 0 0;padding:0;float:left}
.list-entries .summary{overflow:hidden;color:#999}
.list-entries .more-link{border-bottom:none;}
.list-entries .more-link a{display:block;line-height:2em;height:2em;overflow:hidden;text-decoration:none;background-color:#82b965;padding:.5em 1em;position:relative;font-weight:bold;color:white}
.list-entries .more-link a:after{content:"";width:0;height:0;position:absolute;top:50%;right:.3em;border:4px solid transparent;border-left-color:white;margin-top:-4px}
.list-entries .more-link a:hover{background-color:#71a555} /* Custom CSS */ 
.list-entries { margin:7px; width:227px; /* Lebar widget */ float:left; font-size:10px; } </style><br /> <br /> <div id="feed-list-container"> </div> <div style="clear: both;"> </div> <br /> <script type="text/javascript"> var multiFeed = { feedsUri: [ { name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" },
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" },
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" }, 
{ name: "Nama Label", url: "#", tag: "Tags Kamu" } 
], numPost: 4, showThumbnail: true, showSummary: false, summaryLength: 0, titleLength: "auto", thumbSize: 72, containerId: "feed-list-container", readMore: { text: "Selengkapnya", endParam: "?max-results=10" } }; </script><br /> <script src="http://blogger-json-experiment.googlecode.com/svn/resources/multi-feed/multi-feed.min.js" type="text/javascript"></script> <br /> <div style="clear: both;"> </div>

1. Ganti kode # dengan alamat URL blog Anda,
2. Ganti kode Nama Label dengan Nama Label anda,
3. Ganti kode Tags Kamu dengan Tag label kamu,
4. Jika ingin menambah daftar isi, Anda dapat menambah kode di bawah ini setelah tanda },.

{
name: "Nama Label", url: "#", tag: "Tags Kamu" },