Cara Membuat Halaman Posting Sitemap/Daftar Isi Ala Artikel Karya Ku

Sitemap blog adalah suatu fitur pada blog anda yang berguna untuk memudahkan para pengguna atau pengunjung blog bisa melihat semua isi konten blog sesuai menurut label atau kategori pada blog anda.

Jadi sitemap blog, sangat berguna untuk blog anda bagi para pengunjung, untuk menavigasi atau melihat konten atau mencari semua konten yang sesuai pada kategori blog anda. Bagi anda yang memang sangat membutuhkannya, silahkan saja baca lebih lanjut artikel saya ini.

Widget ini adalah suatu modifikasi saya dari sejak waktu mengubah nama judul dan link url blog saya. Saya mengulik-ulik dan tentunya berhasil saya buat dengan karya buatan saya sendiri. Bila mana anda penasaran dengan tampilannya, lihat saja pada gambar screenshot dibawah ini.

Dan dibawah ini adalah cara membuat sitemap ala Artikel Karya Ku, silahkan saja simak gan !
Masukan saja code JavaScrift dibawah ini pada bagian postingan HTML (bukan di bagian Compose).

<div style="border: none; overflow: auto;">
<style type="text/css">
#daftar-isi {background-color:#000;border:2px solid #077;color:#fff;margin-bottom:10px;-webkit-box-shadow:0 1px 2px #000; -moz-box-shadow:0 1px 2px #000;box-shadow:0 1px 2px #000;overflow:hidden;}
#daftar-isi .judul-label {overflow: hidden;cursor: pointer;border-top: 1px solid #000000;font: 12px Arial, time new roman;padding: 5px 10px 5px;color: #FFF;background: #002630 url(https://lh3.googleusercontent.com/-d_qriMoNslY/UuI-Zl86ERI/AAAAAAAACec/ysB-HT5mVSE/s16/arrow.gif) no-repeat right center;}
#daftar-isi .headactive {color: #eee;border-top: 1px solid #EBEBEB;background: #666 url(https://lh4.googleusercontent.com/-kfn0bltVTQo/UuI-Zk13ivI/AAAAAAAACeY/L9FBpKTICrc/s16/arrow0.gif) no-repeat right center;}
#daftar-isi ol {background-color: #E0E0E0;margin:0 0;padding:0 0;color:#999;list-style:none;}
#daftar-isi li {line-height:normal;font: 11px arial;margin:0 0;padding:5px 5px 5px 15px;white-space:nowrap;text-align:left;border-bottom:1px dashed #333;}
#daftar-isi li:first-child {border-top:none;}
#daftar-isi a              {color:#000;}
#daftar-isi a:hover        {text-decoration:none;color:tan;}
#daftar-isi a:visited      {color:tan;}
#daftar-isi strong {font-weight:bold;font-style:italic;color:#0a9;}
#comments{display:none;}
</style>
<script type="text/javascript">
    var showNew    = true,
    accToc     = true,
    openNewTab = true,
    maxNew     = 10,
    baru       = "New!",
    sDownSpeed = 600,
    sUpSpeed   = 600;
</script>
<script src="http://yourjavascript.com/41674415212/daftar-isi-ak.js" type="text/javascript"></script>
<script src="URL BLOG ANDA/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"> </script>
</div>

Setelah anda paste pada postingan anda, silahkan saja klik Publikasikan. Namun bila anda petinjau, sitemap tersebut kadang tidak bisa tampil, dan bila anda sudah publikasikan, pasti tampil.

Keterangan pada text yang diwarnai warna oren, silahkan ganti dengan URL blog anda.

Bila anda ingin mengubah tampilan warna dan background pada sitemap tersebut, silahkan saja sesuaikan saja dengan mengubah tampilannya menurut keinginan anda.