Kode Sitemap HTML: Halaman Daftar Isi Blog Berdasarkan Tanggal

Baca Juga

SITEMAP adalah peta situs berupa kode xml dan html untuk mesin telusur Google dan untuk pengguna. Namun, sitemap juga dipahami sebagai daftar isi (table of content) blog.

Sitemap XML adalah kode berupa sitemap.xml yang ditambahkan di belakang nama blog saat blog didaftarkan di Google Search Console. Sitemap xml hanya bisa dibaca oleh Google.

Sitemap HTML  adalah peta situs berupa daftar postingan yang ditampilkan di halaman khusus, yaitu di salah satu halaman statis (static page).

Ada beberapa kode sitemap html yang bisa digunakan.

1. Sitemap Simple (Lihat Demo)
2. Sitemap Tabel (Lihat Demo)
3. Sitemap Blog Berdasarkan Tanggal Publikasi (Lihat Demo) 

Dalam postingan kali ini CB share sitemap html yang ketiga, yaitu Kode Sitemap HTML: Halaman Daftar Isi Blog Berdasarkan Tanggal Publikasi.

Cara Membuat Halaman Sitemap Berdasarkan Tanggal

1. Page > New Page
2. Isi judul halaman dengan Sitemap
3. Klik mode HTML
4. Copas kode berikut ini:

<style>
#w-sitemap-wrapper {font-size:13px}
#w-sitemap-wrapper li {position:relative;padding:.385em 0 .385em 6.923em;border-top:none;border-bottom:1px solid #f6f6f6}
#w-sitemap-wrapper span {position:absolute;left:0;color:#bd8b56}
#w-sitemap-wrapper a {font-weight:bold}
#w-sitemap-loading-msg {height:100px;line-height:100px;text-align:center;font-weight:bold;letter-spacing:1px;font-size:18px;color:#bbbbbb}
</style>
<script>
(function(c,m){var h=window;var l=document;var e="w-sitemap-wrapper";var g="w-sitemap-loading-msg";var b=h.location;var n=b.protocol;var f=b.hostname;var k=0;l.write("<div id='"+e+"'><ol></ol><div id='"+g+"'>"+m+"</div></div>");var a=l.getElementById(e);var d=l.getElementById(g);var j=l.getElementById(e).getElementsByTagName("ol")[0];function i(o){var p=l.createElement("script");p.src=n+"//"+f+"/feeds/posts/summary?alt=json-in-script&callback=wijs_get_sitemap&start-index="+o+"&max-results=150";a.appendChild(p)}h.wijs_get_sitemap=function(E){var A=E.feed.entry;var u=parseInt(E.feed.openSearch$totalResults.$t);var x=A.length;var w="";for(var s=0;s<x;s++){var o=A[s];var C=o.title.$t;var p;var D=o.link;var y=D.length;for(var r=0;r<y;r++){if(D[r].rel==="alternate"){p=D[r].href;break}}var z=o.published.$t;var q=z.substring(0,4);var t=z.substring(5,7);var v=z.substring(8,10);var B=c.replace("dd",v).replace("mm",t).replace("yyyy",q);w+="<li><span>"+B+"</span><a href='"+p+"'>"+C+"</a></li>"}j.innerHTML+=w;k+=x;if(k<u){i(k+1)}else{d.parentNode.removeChild(d)}};i(1)})("dd/mm/yyyy","Loading......");</script>

5. Langsung Publikasikan!

Ingat ya, langsung publikasikan di mode HTML. Jika kode ini tidak berfungsi di blog Anda. artinya gak cocok dengan template blog yang Anda gunakan.

Kode Sitemap HTML NJW

Ini kode Sitemap HTML yang digunakan New Johny Wuss.

<style>

#w-sitemap-wrapper {font-size:14px;margin:0}

#w-sitemap-wrapper ol li {list-style:none}

#w-sitemap-wrapper ol {padding:0}

#w-sitemap-wrapper li {position:relative;padding:.385em 0 .385em 6.923em;border-top:none;border-bottom:1px solid #f6f6f6}

#w-sitemap-wrapper span {position:absolute;left:0;color:#bd8b56}

#w-sitemap-wrapper a {font-weight:bold}

#w-sitemap-loading-msg {height:100px;line-height:100px;text-align:center;font-weight:bold;letter-spacing:1px;font-size:18px;color:#bbbbbb}

</style>

<script>

(function(c,m){var h=window;var l=document;var e="w-sitemap-wrapper";var g="w-sitemap-loading-msg";var b=h.location;var n=b.protocol;var f=b.hostname;var k=0;l.write("<div id='"+e+"'><ol></ol><div id='"+g+"'>"+m+"</div></div>");var a=l.getElementById(e);var d=l.getElementById(g);var j=l.getElementById(e).getElementsByTagName("ol")[0];function i(o){var p=l.createElement("script");p.src=n+"//"+f+"/feeds/posts/summary?alt=json-in-script&callback=wijs_get_sitemap&start-index="+o+"&max-results=150";a.appendChild(p)}h.wijs_get_sitemap=function(E){var A=E.feed.entry;var u=parseInt(E.feed.openSearch$totalResults.$t);var x=A.length;var w="";for(var s=0;s<x;s++){var o=A[s];var C=o.title.$t;var p;var D=o.link;var y=D.length;for(var r=0;r<y;r++){if(D[r].rel==="alternate"){p=D[r].href;break}}var z=o.published.$t;var q=z.substring(0,4);var t=z.substring(5,7);var v=z.substring(8,10);var B=c.replace("dd",v).replace("mm",t).replace("yyyy",q);w+="<li><span>"+B+"</span><a href='"+p+"'>"+C+"</a></li>"}j.innerHTML+=w;k+=x;if(k<u){i(k+1)}else{d.parentNode.removeChild(d)}};i(1)})("dd/mm/yyyy","Loading......");</script>

Demikian Kode Sitemap HTML: Halaman Daftar Isi Blog Berdasarkan Tanggal Publikasi dan cara membuatnya.*

Sumber