CARA MEMBUAT DAFTAR ISI BLOG ATAU SITE MAP BLOG

Sebelum membuat daftar isi blog sebaiknya anda tahu dulu apa manfaat dan fungsi daftar isi blog dan kenapa harus dibuat. Manfaat daftar isi blog bagi pengunjung blog adalah mudah berselancar dalam blog anda sesuai dengan label blog yang kita buat. Dengan navigasi yang baik maka pengunjung akan senang berada di blog anda, tentu saja ini sangat menguntungkan bagi blog anda karena akan meningkatkan retensi pembaca blog anda dan secara otomatis juga akan berdampak positif terhadap SEO blog. Begitulah kira-kira yang saya pahami mengapa daftar isi harus ada pada setiap blog. Contoh Daftar isi blog
Lantas bagaimana cara membuat daftar isi blog? Gampang dan sangat cepat! Ikuti langkah-langkah berikut:

1. Pastikan anda memiliki blog (((( ya iyalah... kalau tidak punya blog apa yang  mau dibuati daftar isinya mo***ng :-D :-D  )))) Tapi jika anda memang belum punya blog silahkan baca cara membuat blog di blogger.
2. Masuk ke bagian dashbor blogger kemudian pilih menu Laman atau Page dan klik tab New Page di bagian atas. Buatkan judul Peta Situs atau Site Map atau Daftar isi.
3. Pastikan anda berada pada Mode HTML bukan Compose (lihat gambar)
4. Cpoy dan Paste kan salah satu kode di bawah ini (jangan semuanya nanti malah amburadul atau tidak muncul wkkwkwkwkwkw....)))) 
5. Jika sudah, klik tombol  tombol Publish dan lihat hasilnya. Done!

Kode script #1 :

<style>
p.labels a{color: #242424; text-transform: uppercase;font-size: 15px;}
a.post-titles {color: #0000FF;}
ol li{list-style-type:decimal;line-height:25px;}
</style>
<script type="text/javascript" src="http://yourjavascript.com/7366511402/simplesitemap.js"></script>
<script src="http://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=bloggersitemap"></script>

Kode script #2 : 

<style>
p.labels a {
    color: #fff;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    border-bottom: 1px solid #ddd;
    display: block;
    padding: 8px;
    background: #555;
}
a.post-titles {color: #0000FF;}
ol li{list-style-type:decimal;line-height:25px;}
.sitemap-link{display:none}
</style>
<script type="text/javascript" src="http://yourjavascript.com/7366511402/simplesitemap.js"></script>
<script src="/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=bloggersitemap"></script>

Kode Script #3 :

<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>
<div id="toc">
<script src="https://googledrive.com/host/0ByNodV_m9cVLR0pmWFgwZ1NmdW8/" type="text/javascript"></script>
<script src="http://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>

Kode Script #4 :

<script src=" http://mastergomaster.googlecode.com/files/daftar%20isi%20blog.js "></script>
<script src="http://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

Kode Script #5 :

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

Silahkan dicoba satu-satu dan pilih mana yang kira-kira paling cocok untuk diterapkan di blog anda