Cara Ke-2 Membuat Sitemap / Daftar Isi Blogger Otomatis

Cara membuat sitemap atau daftar isi Blogspot atau Blogger di artikel ini merupakan cara kedua atau sebagai alternatif dari artikel sebelumnya yaitu cara ke-1 dan termudah membuat daftar isi / sitemap. Jika dibandingkan dengan cara pertama, cara kedua ini sedikit lebih banyak langkah-langkah dalam pembuatannya. Karena di sini kita perlu menambahkan kode ke dalam Template Blogger.

Perlu kita ketahui bahwa sitemap atau daftar isi pada artikel ini ditujukan untuk pengunjung bukan untuk robot suatu search engine.

Gambar 1. Daftar Isi / Sitemap

Berikut cara kedua membuat sitemap / daftar isi otomatis di Blogger :

1. Masuk ke akun blogger
2. Pilih menu 'Template'
3. Klik tombol 'Edit HTML'
4. Masukkan kode berikut sebelum </head>
   
   

   <b:if cond='data:blog.pageType == &quot;static_page&quot;'><script type='text/javascript'> //<![CDATA[ function kedua(e){function t(){if("entry"in e.feed){var t=e.feed.entry.length;numberfeed=t;ii=0;for(var n=0;n<t;n++){var r=e.feed.entry[n];var i=r.title.$t;var s=r.published.$t.substring(0,10);var o;for(var u=0;u<r.link.length;u++){if(r.link[u].rel=="alternate"){o=r.link[u].href;break}}var a="";for(var u=0;u<r.link.length;u++){if(r.link[u].rel=="enclosure"){a=r.link[u].href;break}}var f="";if("category"in r){for(var u=0;u<r.category.length;u++){f=r.category[u].term;var l=f.lastIndexOf(";");if(l!=-1){f=f.substring(0,l)}postLabels[ii]=f;postTitle[ii]=i;postUrl[ii]=o;ii=ii+1}}}}}t();sortBy="titleasc";sortPosts(sortBy);sortlabel();tocLoaded=true;displayToc2();document.write();document.write('<br /><a href="http://www.ardilas.com/2015/04/cara-mudah-gampang-membuat-sitemap-daftar-isi-blogger-blogspot-otomatis.html" style="font-size: 10 px; text-decoration:none; color: #616469;" target="_blank" title="Cara Ke-2 Membuat Daftar Isi / Sitemap Blogspot">Sitemap</a>');}function filterPosts(e){scroll(0,0);postFilter=e;displayToc(postFilter)}function allPosts(){sortlabel();postFilter="";displayToc(postFilter)}function sortPosts(e){function t(e,t){var n=postTitle[e];postTitle[e]=postTitle[t];postTitle[t]=n;var n=postUrl[e];postUrl[e]=postUrl[t];postUrl[t]=n;var n=postLabels[e];postLabels[e]=postLabels[t];postLabels[t]=n;var n=postBaru[e];postBaru[e]=postBaru[t];postBaru[t]=n}for(var n=0;n<postTitle.length-1;n++){for(var r=n+1;r<postTitle.length;r++){if(e=="titleasc"){if(postTitle[n]>postTitle[r]){t(n,r)}}if(e=="titledesc"){if(postTitle[n]<postTitle[r]){t(n,r)}}if(e=="dateoldest"){if(postDate[n]>postDate[r]){t(n,r)}}if(e=="datenewest"){if(postDate[n]<postDate[r]){t(n,r)}}if(e=="orderlabel"){if(postLabels[n]>postLabels[r]){t(n,r)}}}}}function sortlabel(){sortBy="orderlabel";sortPosts(sortBy);var e=0;var t=0;while(t<postTitle.length){temp1=postLabels[t];firsti=e;do{e=e+1} while(postLabels[e]==temp1);t=e;sortPosts2(firsti,e);if(t>postTitle.length){break}}}function sortPosts2(e,t){function n(e,t){var n=postTitle[e];postTitle[e]=postTitle[t];postTitle[t]=n;var n=postUrl[e];postUrl[e]=postUrl[t];postUrl[t]=n;var n=postLabels[e];postLabels[e]=postLabels[t];postLabels[t]=n}for(var r=e;r<t-1;r++){for(var i=r+1;i<t;i++){if(postTitle[r]>postTitle[i]){n(r,i)}}}}function displayToc2(){var e=0;var t=0;while(t<postTitle.length){temp1=postLabels[t];document.write('<p style="background: #f7f7f7;padding: 5px;" />');document.write('<span class="labl"><span>Label :  </span><a href="/search/label/'+temp1+'">'+temp1+"</a></span><ul class='postname'>");firsti=e;do{document.write("<li>");document.write('<a href="'+postUrl[e]+'">'+postTitle[e]+"</a>");document.write("</li>");e=e+1}while(postLabels[e]==temp1);t=e;document.write("</ul>");sortPosts2(firsti,e);if(t>postTitle.length){break}}}var postTitle=new Array;var postUrl=new Array;var postLabels=new Array;var postBaru=new Array;var sortBy="titleasc";var tocLoaded=false;var numChars=250;var postFilter="";var numberfeed=0;document.write("") //]]> </script><b:else/></b:if>

   
   
5. Pilih menu 'Laman' atau 'Pages'
6. Buat laman baru (Klik tombol 'Laman baru' > 'Laman kosong')
7. Pilih mode 'HTML'
8. Beri judul Daftar Isi atau Sitemap (judul terserah anda)
9. Masukkan kode berikut
   
   

   <script src="http://ardilas.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=kedua"></script> 

   
   
10. Ganti kode 'ardilas.com' di atas dengan alamat blog anda
11. Publikasikan
12. Selesai. Contoh hasilnya bisa dilihat di gambar 2 atau di Daftar Isi Ardilas.com

Gambar 2. Daftar Isi / Sitemap

Daftar Isi / Sitemap Ber-scroll

Apabila anda menginginkan daftar isi atau sitemap yang memiliki scroll di samping kanan (gambar 3), anda bisa menggunakan kode berikut sebagai ganti kode dari poin nomer 9 diatas :

<div style="background-color: #dde1e3; border: 1px solid #999999; height: 100px; overflow: auto; padding: 10px; width: 100%px;">
<script src="http://ardilas.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>
</div>

Nilai '100' pada 'height' bisa dirubah sesuai dari panjang daftar isi yang diinginkan. Jangan lupa ganti kode 'ardilas.com' di atas dengan alamat blog anda. Dan silahkan melakukan perubahan dan percobaan sendiri, agar sesuai dengan selera anda.

Gambar 3. Daftar Isi / Sitemap ber-scroll

Informasi terkait

1. Cara ke-1 membuat sitemap
2. Cara ke-3 membuat sitemap