Membuat daftar isi sederhana di blog

Bon-Template Tutorials, halo sobat blogger, berbicara mengenai sebuah blog memang menarik, terutama lagi ada konten atau artikel yang ingin kita cari di dalam sebuah situs, dan tentunya ketika dalam proses pencarian artikel tersebut kita harus masuk dan memeriksa seluruh konten yang terdapat di dalam sebuah situs, kita akan dipermudahkan pada saat memeriksa atau mencari artikel yang dibutuhkan jika situs yang dijelajahi terdapat atau menyediakan peta situs dalam kata lain daftar isi, sehingga tidak perlu repot lagi untuk membuka semua halaman situs tersebut satu persatu.  Ada baiknya blog atau website kita juga menyediakan peta situs seperti yang Bon-Template bahas di atas tadi guna memudahkan pengunjung mencari artikel di blog kita, berikut panduan dalam membuat peta situs sederhana di blog atau website.

Menjelajahi sebuah situs yang di lengkapi dengan peta situs atau daftar isi dan dalam bahasa daerahnya disebut sitemap,

• Masuklah ke akun Blog
• Pilih menu laman atau pos
• Klik HTML jangan Compose
• Beri judul terlebih dahulu
• Masukan kode yang saya siapkan dibawah ini

<script src="https://sites.google.com/site/antoncabonnew/resources/daftarisi.js"></script>
<script src="http://bon-template.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

• Kode warna biru ganti dengan url blog sobat.
• Lalu simpan

Jika artikel di blog sobat blogger sudah banyak sekali postingan, maka supaya daftar isi nya tidak terlalu memanjang kebawah, gunakan fungsi menu scroll sebagai berikut

<div style="overflow:auto;width:400px;height:200px;padding:10px;border:2px solid #000">
Kode daftar isi
</div>

 Contohnya akan seperti ini:

<div style="overflow:auto;width:400px;height:200px;padding:10px;border:2px solid #000">

<script src="https://sites.google.com/site/antoncabonnew/resources/daftarisi.js"></script>
<script src="http://bon-template.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>
</div>

Kode daftar isi

Selamat mencoba, dan terimakasih sudah berkunjung.

DEMO