rss

Rabu, 03 Agustus 2011

Cara Membuat Daftar Isi Blog

Tidak hanya pada buku, tapi blog juga bisa mempunyai sebuah daftar isi. Hmm,, dengan daftar isi pengunjung blog akan mudah menemukan artikel yang akan mereka baca. Sebagai contoh, di bagian sidebar blog ini telah saya pasang daftar isinya sehingga anda bisa menjelajahi blog ini tanpa keraguan akan tersesat, hehehe…. Tapi untuk anda yang baru di dunia Blogger dan malas ngetik, maka di tips kali ini akan saya jelaskan cara membuat daftar isi secara otomatis. Kenapa otomatis? Karena di setiap kali kita membuat artikel maka daftar isinya akan langsung bertambah dengan sendirinya. Mau tau caranya?

Berikut Cara Membuat Daftar Isi Blog:

1. Login ke akun Blogger anda

2. Pilih Layout > Edit HTML

3. Backup dulu template anda.

4. Cari kode ]]></b:skin>, lalu paste kode berikut tepat di atasnya:

#toc { border: 0px solid #000000; background: #ffffff; padding:2px; width:495px; margin-top:10px;}
.toc-header-col1, .toc-header-col2,
.toc-header-col3 { background: #B5CBFA; color: #000000; 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:#f0f0f0;}


5. Klik Save Template

6. Selanjutnya, pilih menu Page Elements

7. Tambahkan Page Elements dengan HTML/Javascript

8. Paste kode <div id="toc"></div> ke dalam kotak content, lalu klik Save

9. Pindahkan element tersebut ke atas element post

10. Tambahkan Page Elements dengan HTML/Javascript. Beri judul yang anda inginkan, lalu paste kode berikut ke dalam kotak content:

Kode untuk tampilan berbahasa Inggris:

<div id="toclink"><a href="javascript:showToc();">Daftar Isi</a><br/><br/></div><script style="text/javascript" src="http://tipsbloggerzacky.googlecode.com/files/blogtoc.js"></script><script src="http://NAMABLOGANDA.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>


Kode untuk tampilan berbahasa Indonesia:

<div id="toclink"><a href="javascript:showToc();">Daftar Isi</a><br/><br/></div><script style="text/javascript" src="http://tipsbloggerzacky.googlecode.com/files/daftarisi.js"></script><script src="http://NAMABLOGANDA.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>


Ganti tulisan NAMABLOGANDA dengan alamat blog anda.

11. Terakhir, klik Save untuk menyimpan element baru tersebut.

Selamat mencoba..

Source : Zacky Blog's

0 komentar:

:) :( ;) :D ;;-) :-/ :x :P :-* =(( :-O X( :7 B-) :-S #:-S 7:) :(( :)) :| /:) =)) O:-) :-B =; :-c :)] ~X( :-h :-t 8-7 I-) 8-| L-) :-a :-$ [-( :O) 8-} 2:-P (:| =P~ :-? #-o =D7 :-SS @-) :^o :-w 7:P 2):) X_X :!! \m/ :-q :-bd ^#(^ :ar!

Posting Komentar


Jangan kalah dengan blogger negara tetangga, sertakan link sumber saat berbagi informasi

Get Update on Facebook !

Info Terkini

Advertise

ads ads ads ads
 

Daftar Blog Saya

free counters

ads ads

Anda Pengunjung :

Followers

Diberdayakan oleh Blogger.

Checkpagerank.net Yahoo bot last visit powered by MyPagerank.Net Msn bot last visit powered by MyPagerank.Net Google PageRank Checker Powered by  MyPagerank.Net Ping your blog, website, or RSS feed for Free Blogs lists and reviews Page Rank AutoBacklinkGratisFree Promotion LinkFree Smart Automatic BacklinkMalaysia Free Backlink Services MAJLIS LINK: Do Follow BacklinkLink Portal Teks TVjapanese instant free backlink Free Plugboard Link Banner ButtonFree Automatic Backlink Service Page Ranking Tool BELAJAR|GAPTEK