Cara Membuat Daftar Isi/Site Map Otomatis Sesuai dengan Label di Blog

Cara Membuat Daftar Isi/Site Map Otomatis Sesuai dengan Label diblog - Haii sobat AS,kali ini saya akan membagikan artikel tentang cara membuat daftar isi/site map otomatis dengan label.Daftar Isi berfungsi sebagai pemudah pengunjung blog untuk melihat dan mencari artikel yang dicari.

Daftar isi yang saya bagikan ini berbeda dengan daftar isi yang lainnya karena daftar isi ini sudah otomatis memuat yang artikel dalam blog sesuai dengan label artikel.Jadi artikel yang sudah dipost akan disusun/dikelompokkan kedalam labelnya lalu akan otomatis menjadi daftar isi/site map.

• Lihat Demo Sitemap

 Langsung saja berikut langkah-langkah membuat site map otomatis sesuai dengan label:

Langkah 1
Silakan masuk dulu ke dashbor blog akan akan dipasang daftar isi

Langkah 2
Klik Laman → laman baru → pilih yang html bukan yang compose (Lihat gambar untuk kejelasan)

Langkah 3
Salin kode html di bawah ini lalu letakkan di lembar kerja laman yang telah kita buka tadi.
#NB Ganti kode yang yang berwarna merah dengan alamat blog/web sobat.

Kode Html

<style type="text/css">#toc{ width:99%; margin:5px auto; border:1px solid #2D96DF; -webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); -moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); } .labl{ color:#FF5F00; font-weight:bold; margin:0 -5px; padding:1px 0 2px 11px; background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%); background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE)); border:1px solid #2D96DF; border-radius:4px;-moz-border-radius:4px; -webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb; -moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block; } .labl a{ color:#fff; } .labl:first-letter{t ext-transform:uppercase; } .new{ color:#FF5F00; font-weight:bold; font-style:italic; } .postname{ font-weight:normal; background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%); background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE)); } .postname li{ border-bottom: #ddd 1px dotted; margin-right:5px } </style><br /><div id="toc"><script src="https://googledrive.com/host/0ByNodV_m9cVLR0pmWFgwZ1NmdW8/" type="text/javascript"></script><script src="http://anggasave.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script></div>

Lalu Klik Publikasikan...
Daftar Isi sudah ada diblog/web sobat..cobalah melihat daftar isi yang sobat buat,semoga artikel ini bermanfaat bagi sobat.