Ide@Pelajar

Cara membuat Daftar Isi Otomatis dan Ringan

Pada kesempatan ini saya akan membagi tutorial blog yaitu Cara membuat Daftar Isi (Site Map) Otomatis dan Ringan. Patinya sobat akan berfikir bagaimana kalau blognya ada Daftar isi agar mudah pengunjung lihat history posting sobat yang selama sobat buat dan di postingkan. Untuk artikel baru akan ditandai dengan "New!!" pada daftar isinya. Sungguh keren kan?




Sobat ingin pasang? yuk ikuti langkah-langkah berikut dibawah ini :

1. Login blog
2. Lalu Buatlah Postingan baru atau buat di laman kosong baru
3. Lalu pilih HTML disamping Compose
4. Setelah itu Copy kode dibawah ini

<div style="background-color: none; border: 1px solid #000000; height: 500px; margin: auto; overflow: auto; padding: 3px; text-align: left; width: 100%;">
<script src="http://me-sitemap.googlecode.com/files/sitemapblog.js"></script>
<script src="http://eskun.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>
</div>

5. Lalu ganti kode yang berwarna merah dengan dengan url blog anda.
6. Kemudian Publishkan dan lihat hasilnya.

Untuk tambahan, sobat bisa juga merubah atau memodifikasi sesuai selera tampilan daftar isi sobat :

• none = Ini bisa anda kasih kode warna juga, karena none tersebut adalah warna buat background
• 1 = Angka ini adalah ukuran buat tebal border bisa sobat rubah juga dengan angka 0-9
  
• #000000 = Kode ini adalah kode warna buat border, bisa sobat rubah sesuka hati dengan kode warna
• 500 = Angka ini adalah ukuran tinggi buat border daftar isi sobat
• Auto = ini adalah margin dan overflow, bisa dirubah dengan angka yang sobat inginkan
• 3 = Angaka ini adalah padding bisa sobat rubah dengan angak 0-9
• Left = Adalah posisi tulisan sebelah kiri, bisa dirubah dengan Right(kanan) atau Center(tengah)
• 100% = Ukuran lebar dari kotak daftar isi, rubah lah sesuai keinginan sobat

 
Sangatlah mudah bukan sobat membuatnya? Apabila ada pertanyaan silakan sobat semua tinggalkan komentar dibawah ini. Selamat mencoba ^_^ Read more » Rate this posting: Label : Tips Ngblog