Membuat Daftar Isi Pada Blog

Postingan kali ini saya akan share sedikit tentang cara membuat daftar isi pada blog yang sangat simple, sederhana, dan sangat mudah untuk di praktikkan atau dipasang pada blog anda. Dimana daftar isi ini ini akan secara otomatis terupdate apabila kita memperbaharui atau menambah postingan pada blog anda. 

Sebelum saya memberikan langkah-langkah pemasangannya, baiknya anda melihat dulu review keunggulan atau fitur yang terdapat pada daftar isi tersebut:

• Simple, Keren, dan Otomatis
• Sistematis, tersusun berdasarkan abjad
• Menggunakan fungsi scroll
• Postingan akan dikelompokkan berdasarkan label atau kategori
• Menampilkan keterangan pada postingan, mana yang terbaru
• Menampilkan total postingan blog, dan total comments pada postingan

Print preview nya seperti gambar dibawah ini :

Setelah melihat review diatas bagi anda yang tertarik untuk memasang atau menggunakan daftar isi tersebut, berikut langkah-langkah nya :

• Login ke akun blogger anda
• Pilih Layout
• Pilih Add Gadget
• Pilih HTML/javascript
• Pasang kode dibawah ini

</div> <div> <br></div> <div> <div> <div style="overflow:auto;width:auto;height:200px;padding:10px;border:1px solid #eee"> <script style="text/javascript" src="http://yourjavascript.com/6438331231/contents.js"></script><script src="http://tobaccosarea.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script></div> <div> </div> </div> <div> <script style="text/javascript"></div> <div> function numberOfPosts(json) {</div> <div> document.write('Total Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');</div> <div> }</div> <div> function numberOfComments(json) {</div> <div> document.write('Total Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');</div> <div> }</div> <div> </script></div> <div> <br/></div> <div> <div style='border-bottom:1px dashed #333; float:left;'> <script src="http://tobaccosarea.blogspot.com/feeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script></div> </div> <div> <div style='border-bottom:1px dashed #333; float:right;'> <script src="http://tobaccosarea.blogspot.com/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></div> </div> </div> <div> <br></div> <div>

• Kemudian Save

Keterangan :

• Ganti atau replace http://tobaccosarea.blogspot.com/ dengan alamat blog anda

Silahkan Support Situs Ini Jika Berkenaan ;)

Tweet