Membuat Daftar ISI dengan jQuery Accordion di Blog

Oleh: Pada: 21 Oktober, 2012

 

Sobat blogger sudah lama nih tidak posting tentang Blogger, kali ini saya akan sedikit posting tentang membuat daftar isi dengan jQuery accordion, dengan menerapkan daftar isi di blog kita, maka akan mempermudah pengunjung untuk mengetahui isi dari blog kita, nah pastinya akan banyak juga pembaca artikel kita, betul tidak..? untuk melihat contohnya kamu lihat di daftar isi blog ini, oke kita langsung saja ke lokasi pembuatannya, apa saja bahan-bahan yang di perlukan untuk membuatnya..? tidak sedikit kok,..! cuma secangkir kopi dan sepiring cemilan pasti sukses he… he…

 

Langkah1
silahkan buat halaman baru di blogger.
Masuk dasboard blogger >> klik Menu Posting >> Edit entri >> Laman Baru.

Langkah2
Buat Halaman Beri judul Misal daftar isi dan seting Mode HTML bukan Compose ya pada saat akan posting halaman.

Langkah3
Copy paste kode dibawah ini

<link href="http://abu-farhan.com/script/acctoc/acc-toc.css" media="screen" rel="stylesheet" type="text/css"></link>
<script src="http://abu-farhan.com/script/acctoc/daftarisiv2-pack.js"></script>
<script src="http://niammuddin.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>
<script type="text/javascript">
var accToc=true;
</script>
<script src="http://abu-farhan.com/script/acctoc/accordion-pack.js" type="text/javascript"></script>

ganti url http://niammuddin.blogspot.com dengan url blog kamu

Langkah4
Setelah itu terbitkan.

lihat hasilnya, jreeng.. tara…! menakjubkan bukan.

apabila sobat ingin membuat menu Dafttar isi tinggal copy saja URL postinga tadi, dan masukkan ke dalam URL menu yang akan kita buat.

Oke selesai itu saja semoga berguna dan bermanfaat untuk teman-teman semuanya.
Bila kurang jelas bisa tanyakan di komentar, nanti kita bahas sama-sama.

Update 07/10/2011

Tutorial membuat daftar isi sudah diperbaiki setelah kemaren mengalami masalah dengan kodenya.

Special thanks untuk abu farhan atas scriptnya.

 


#daftar isi blog #javascript #jquery