cara membuat site map akordion

hai sobat blogger kali ini saya mau berbagi nih bagaimana caranya membuat site map akordion..
saya mendapatkan script ini dari blognya wan-soe.blogspot.com.
tampilannya kayak gini

atau bisa lihat langsung di sini

nah bagi yang ingin tau caranya silahkan ikuti langkah langkah berikut ini :
Seperti biasa masuk akun dasbor >> Klik Template >> Edit HTML. Dan temukan kode berikut ]]></b:skin>. Setelah ketemu letakan saja Kode CSS dibawah ini persis diatasnya :

#daftar-isi {
background-color:#333;
border:2px solid #fafafa;
color:#fff;
margin-bottom:10px;
-webkit-box-shadow:0 1px 2px #000;
-moz-box-shadow:0 1px 2px #000;
box-shadow:0 1px 2px #000;
margin-top:-55px;
overflow:hidden;
}
#daftar-isi .judul-label {
overflow:hidden;
cursor:pointer;
text-decoration:none;
font:normal 13px/100% 'Electrolize',Arial,Sans-serif;
padding:10px 15px 11px;
color:#bbb;
text-shadow:0 1px 1px rgba(0, 0, 0, 0.3);
border-top:1px solid #444;border-bottom:1px solid #222;
background-color:#333;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3c3c3c', endColorstr='#333333');
background-image:-webkit-linear-gradient(top, #3c3c3c, #333);
background-image:-moz-linear-gradient(top, #3c3c3c, #333);
background-image:-o-linear-gradient(top, #3c3c3c, #333);
background-image:linear-gradient(top, #3c3c3c, #333);
}
#daftar-isi .headactive {
color:#efefef;
border-top:1px solid #24B6E3;border-bottom:1px solid #104968;
background-color:#248AB0;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#248AB0', endColorstr='#21739B');
background-image:-webkit-linear-gradient(top, #248AB0, #21739B);
background-image:-moz-linear-gradient(top, #248AB0, #21739B);
background-image:-o-linear-gradient(top, #248AB0, #21739B);
background-image:linear-gradient(top, #248AB0, #21739B);
}
#daftar-isi ol {
background-color:#333;
margin:0 0;
padding:0 0;
color:#999;
list-style:none;
}
#daftar-isi li {
line-height:normal;
font:normal 11px/100% 'Verdana',Arial,Sans-serif;
margin:0 0;
white-space:nowrap;
padding:5px 5px 5px 15px;
text-align:left;
border-top:1px solid #444;border-bottom:1px solid #222;
}
#daftar-isi li:first-child {border-top:none;}
#daftar-isi a {color:#5687f8;}
#daftar-isi a:hover {text-decoration:underline;}
#daftar-isi a:visited {color:#5687b8;}
#daftar-isi strong {
font-weight:bold;
font-style:italic;
color:red;
}

Lalu save template anda.

Pada tahap selanjutnya silahkan sobat membuat postingan baru, beri judul terserah anda mau Daftar Isi atau Sitemap.Dan copas kode script dibawah ini pada mode HTML jangan pada mode Compose.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var showNew = true,
accToc = true,
openNewTab = true,
maxNew = 10,
baru = "Baru!",
sDownSpeed = 600,
sUpSpeed = 600;
</script>
<script type="text/javascript" src="http://wanbloggers-code.googlecode.com/files/daftar%20isi%20acordion.js"></script>
<script src="http://iisanim-child.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

Lalu publikasikan.

- Kode warna Biru :  jika pada template anda sudah sudah terdapat code tsb,maka tidak perlu menyisipkan lagi
- Tulisan warna Merah! : boleh ganti dengan keinginan kalian anda  (misal:New!!, Terbaru!!, dll).
- Ganti URL http://wan-soe.blogspot.com dengan URL blog Anda 

- var showNew : Jika bernilai true, tanda merah bertuliskan Baru! akan ditampilkan, jika bernilai false, tanda merah bertuliskan Baru! akan disembunyikan.

- accToc : Jika bernilai true, effect accordion akan diterapkan, jika bernilai false, effect accordion akan hilang sehingga semua daftar isi akan terlihat.

- openNewTab : Jika bernilai true, setiap link akan secara otomatis terbuka di tab/jendela baru saat diklik, jika bernilai false, setiap link akan terbuka di tab/jendela yang sama saat diklik.

- maxNew : Digunakan untuk menentukan jumlah maksimal Baru! yang tampil pada setiap posting baru (Menentukan seberapa banyak posting bisa disebut sebagai posting baru).

- sDownSpeed : Digunakan untuk menentukan kecepatan effect .slideDown() panel.

- sUpSpeed : Digunakan untuk menentukan kecepatan effect .slideUp() panel.

nah begitu saja mudah mudahan bermanfaat yah..

see you..