Minggu, 24 Juni 2012

Membuat Daftar Isi Blog Dalam Scroll Box

Daftar isi blog merupakan bagian penting yang terdapat pada blog. Tujuan dari dibuatnya Daftar isi menurut adalah selain untuk melengkapi tampilan blog supaya keliatan tampak lebih profesional juga untuk membantu visitor/pengunjug blog dalam mencari apa yang dicari. Dan dalam hal ini akan memudahkan para pengunjung blog tersebut.Coba aja bayangkan jika sobat misalkan berkunjung ke suatu blog dan blog tersebut tanpa adanya daftar isi, mungkin sahabat akan kesulitan dalam mencari suatu artikel yang mungkin sedang sahabatm butuhkan. Memasang daftar isi di blog memang dianjurkan,namun jika isi suatu blog ( artikel ) sudah mencapai ratusan maka Daftar isi tersebut besar kemungkinan akan nampak "melorot" dan membuat blog jadi kurang enak dilihat. Untuk mengatasi masalah tersebut, solusinya adalah "Membungkus" daftar isi tersebut menggunakan Scroll box.  Langsung saja sahabat  ikuti langkah-langkah seperti berikut ini :

Silahkan copy dulu kode HTML di bawah ini :

<center>
<div style="border: 4px solid rgb(0, 0, 0); height: 200px; overflow: auto;">
<link href="http://blogdaftarisi.googlecode.com/files/acc-toc.css" media="screen" rel="stylesheet" type="text/css" />
<script src="http://blogdaftarisi.googlecode.com/files/toc.js">
</script>
<script src="http://www.notresponding.us/feeds/posts/summary?max-results=1000&alt=json-in-script&callback=loadtoc">
</script>
<script type="text/javascript">
var accToc=true;
</script>
</div>
<center>


Keterangan :
- Ganti http://www.notresponding.us dengan URL/alamat blog Sahabat
- Height untuk mengatur tinggi daftar isi

  1. Silahkan login dulu ke Blogger
  2. Klik Rancangan
  3. Klik Elemen Laman
  4. Klik Tambah gadget/Add gadget
  5. Klik opsi HTML/Java Script,terus paste-kan kode HTML yang telah sobat copy tersebut dan beri judul DAFTAR ISI / BLOG CONTENTS
  6. Klik Simpan
  7. Jika tampilannDaftar isi nya ingin menarik coba kode yang ini Sahabat...
  8. Code < link href="http://www.notresponding.us/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://www.notresponding.us/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>

    Semoga Anda tidak puas sahabat...Jangan lupa komennya..oh iya bisa juga digabung antara keduanya "tapi" http:// Anda aktifkan satu saja ..biar g bentrok atau doble daftar isinya...selamat mencoba.

0 komentar:

Posting Komentar