Rabu, 08 Desember 2010 -

Cara Membuat Daftar isi


Kalau anda buka buku pada halaman depannya sudah pasti ada yang namanya Daftar Isi, yang tujuannya tiada lain adalah dari melihat Daftar isi ini kita sudah ada gambaran apa saja isi dari buku itu, begitu juga dengan yang namanya Blog. Dengan adanya Daftar Isi Blog ini bisa memuaskan pengunjung di Blog kita, dan pesan saya agar memperhatikan antara judul dan isi supaya nyambung, karena saya pernah mengalami judulnya A isinya A1 sampai habis baca baru terakhir ditulis postingan untuk judul A akan menyusul, kesal nggak hati kita.






Sekarang mari kita coba berbagi / sharring cara membuat Daftar Isi Blog, yang pada prinsip dasarnya bagi saya ada 2 (dua) macam yaitu secara manual dan otomatis. Kedua-duanya punya kelebihan dan kekurangan, tergantung dengan kebutuhan dan keperluan kita masing-masing, Cuma secara global kelebihan dan kekurangannya yaitu :  


  • Untuk yang manual punya Kekurangan yaitu kita setiap posting baru harus menambahkan, yang secara tak langsung ini merupakan kelebihannya karena kadang-kadang seperti Blog saya ini contoh data Blog, iklan banner / sponsor tak tampil di daftar, artinya kita bisa memilah-milah atau memilih yang akan kita tampilkan, hal ini saya sampaikan karena semuanya saya simpan di editor postingan tujuannya untuk memperingan loading Blog.

  • Untuk yang otomatis sermua Artikel / postingan akan ditampilkan, terkecuali kita membuat artikel / postingan kita pilah – pilah.






Baiklah sekarang kita bahas satu persatu yaitu dari yang manual.


Anda pernah mengunjungi Blognya Kang Rohman (http://kolom-tutorial.blogspot.com).


Disinilah saya dapat ngintip dan contohnya di pojok kiri atas Blog ini


Cara membuatnya sebagai berikut :





  • Seperti biasa masuk ke Blogger dengan ID anda.

  • Pada Dasbor pilih Rancangan – tambah gadget

  • Pilih elemen / klik tanda tambah pada HTML / Javascript

  • Copas (copy-paste) script berikut kedalam

  • Penempatan bebas



<div align="top">

<span class="Apple-style-span" style="color: yellow; font-size: 16px; font-weight: normal;"><b><blink>BLOG TUTORIAL UNTUK PEMULA</blink></b></span>

<div style="-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #369; height: 160px; overflow: auto; padding-left: 20px; width: 330px;">

<ol>

<li><a href="http://tips-blogbego.blogspot.com/2010/12/cara-membuat-elemen-tersembunyi.html">Cara membuat Elemen Tersembunyi</a></li>

<li><a href="http://tips-blogbego.blogspot.com/2010/12/cbox-kotak-chatting-alternatif.html">CBox Kotak Chatting alternatif</a></li>

<li><a href="http://tips-blogbego.blogspot.com/2010/12/klik-label-yang-tampil-judulnya-saja.html">Klik Label Tampilkan Judulnya saja</a></li>

<li><a href="http://tips-blogbego.blogspot.com/2010/12/membuat-kotak-chatting-dengan-shoutmix.html">Membuat Kotak Chatting di Shoutmix</a></li>

<li><a href="http://tips-blogbego.blogspot.com/2010/11/undefined-tehnik-extreme-menyelamatkan.html">Undefined tehnik extreme menyelamatkan...</a></li>

<li><a href="http://tips-blogbego.blogspot.com/2010/11/cara-membuat-slide-di-blog.html">Cara membuat slide di Blog</a></li>

<li><a href="http://tips-blogbego.blogspot.com/2010/11/10-tips-cegah-kriminalitas-di-dunia.html">10 TIPS cegah Kriminalitas di Dunia Maya</a></li>

<li><a href="http://tips-blogbego.blogspot.com/2010/11/sejarah-penyimpanan-data-data-storage.html">Sejarah Penyimpanan Data</a></li>

</ol>

</div>

</div>

Hasilnya sebagai berikut :








Kalau yang secara otomatis :


<script style="text/javascript" src="http://www.srbekasi.org/daftar-isi.txt"></script>

<script style="text/javascript">

var numposts = 1000;

var showpostdate = false;

var showpostsummary = false;

var numchars = 100;

var standardstyling = true;

</script>

<script src="http://tips-blogbego.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&max-results=999&callback=showrecentposts"></script>




Hasilnya sebagai berikut :




BLOG TUTORIAL UNTUK PEMULA










Kalau yang secara otomatis berikut ada tulisan News :

Daftar iisi berikut didapat dari (http://www.abu-farhan.com)






<script src="http://www.abu-farhan.com/script/daftarisiblogger/blogtoc-min.js">
</script>
<script src="http://tips-blogbego.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>


Hasilnya sebagai berikut :



BLOG TUTORIAL UNTUK PEMULA












Dari 3 pilihan diatas silahkan anda pilih sesuaikan dengan keperluan anda, caranya pemasangannya semuanya sama seperti tersebut diatas.


Ganti semua link atau Nama Blog saya (http://tips-blogbego.blogspot.com) dengan link atau Nama Blog anda.







2 komentar:

  1. script dari abu farhan paling mudah tuh

    BalasHapus
  2. Trims kawan kunjungannya, kalau dilihat dari scriptnya memang, tapi satu artikel bisa tampil banyak sesuai label / katagorinya. :f

    BalasHapus