Selasa, 26 Juni 2012
Salah satu bagian yang cukup penting dalam sebuah blog adalah daftar isi, karena dengan itu pembaca bisa melihat isi dari blog secara global.
Langkah Pertama :
- Login ke akun Blogger kamu
- Dari halaman dashboard, pilih Template
- Kemudian Edit HTML, centang "Expand Template Widget"
- Cari kode ]]></b:skin>
- Copykan script berikut dan letakkan diatas kode ]]></b:skin> tersebut
#toc { border: 0px solid #8A4B08; background: transparent; padding:2px; width:495px; margin-top:10px;}
.toc-header-col1, .toc-header-col2,
.toc-header-col3 { background: #8A4B08; color: transparent; padding-left: 5px; width:250px;}
.toc-header-col2 { width:75px;}
.toc-header-col3 { width:125px;}
.toc-header-col1 a:link, .toc-header-col1 a:visited,
.toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link,
.toc-header-col3 a:visited { font-size:100%; text-decoration:none;}
.toc-header-col1 a:hover,
.toc-header-col2 a:hover,
.toc-header-col3 a:hover { font-size:100%; text-decoration:underline; color:#3D3F44;}
.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 { padding-left: 5px; font-size:100%; background: transparent;}
Keterangan : Warna hijau menunjukan kode warna yang bisa kamu ganti sesuai dengan warna blog kamu.
Langkah Kedua :
- Klik Page Element
- Klik Add Gadget
- Klik plus button (+) for HTML/JavaScript
- Copy kode dibawah ini
<div id="toclink"><a href="javascript:showToc();">LIHAT DAFTAR ISI</a><br /><br /></div>
<script style="text/javascript" src="http://sites.google.com/site/kibagusnet/x-design/blogtoc.js"></script>
<script src="http://davidchielietonga06.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>
<br />
<div style="-moz-background-clip: -moz-initial; -moz-background-inline-policy: -moz-initial; -moz-background-origin: -moz-initial; -moz-border-radius-bottomleft: 0px; -moz-border-radius-bottomright: 0px; -moz-border-radius-topleft: 0px; -moz-border-radius-topright: 0px; background: transparent url(#) no-repeat scroll 0 0 ; border: 1px solid rgb(204, 204, 204); height: 150px; margin: 10px 0px; overflow: auto; padding: 10px; text-align: center; width: auto;">
<div id="toc"></div>
</div>
Keterangan :
- Pasang widget tersebut diatas posting, karena daftar isi ini
membutuhkan tempat yang cukup lebar, kalau kamu ingin di pasang pada
tempat lain dengan lebar minim tidak menjadi masalah karena pada script
ini telah aku tambah script fungsi scroll ( warna kuning ) agar bisa fleksible dengan konsekuensi scroll akan muncul karena lebar template tidak cukup.
- Ganti kode >LIHAT DAFTAR ISI< dengan kata kata kamu sendiri.
- Ganti kode http://davidchielietonga06.blogspot.com/feeds/posts/default dengan URL kamu sendiri.
Related Posts :
- Back to Home »
- TUTORIAL BLOGSPOT »
- Cara Membuat Daftar Isi Otomatis Versi 1