Daftar Isi atau Sitemap HTML sangat penting untuk memberikan ruang informasi kepada pengunjung agar mengetahui seluruh isi artikel pada blog. Pada Artikel kali ini DemosWebId akan mengulas tentang Cara Membuat Sitemap HTML di Blogspot, yuk kita mulai saja.
Apa itu Sitemap?
Sitemap adalah file berisi daftar pos/laman dari sebuah website yang dapat memberi tahu Google dan mesin pencari lainnya tentang struktur konten website tersebut.
Sitemap sendiri terdiri dari dua macam, yaitu sitemap XML dan sitemap HTML. Perbedaan utama di antara keduanya ada pada format penulisan serta untuk siapa sitemap tersebut ditujukan.
Sitemap XML adalah daftar isi pos dan laman yang dibuat dalam format XML. Sitemap ini ditujukan untuk mesin pencari agar mereka lebih mudah merayapi dan mengindeks situs kita. Sitemap jenis ini pulalah yang kita input ke Google Search Console agar situs kita lebih cepat diindex oleh Google.
Sitemap HTML sendiri adalah daftar isi yang biasanya berisi pos saja yang dibuat agar pembaca dapat dengan mudah melihat semua postingan di blog kita. Sesuai dengan namanya, sitemap ini ditulis dalam format HTML. Dan tidak seperti sitemap XML yang dibuat secara otomatis, sitemap HTML harus dibuat secara manual.
Cara Membuat Sitemap di Blogger
Cara ini adalah cara sederhana untuk menampilkan daftar semua pos di Blogger. Daftar judul postingan akan diurutkan berdasarkan waktu publikasi sehingga pembaca dapat melihat urutan pos secara kronologis.
Ikuti langkah-langkah cara membuat sitemap di blogspot menggunakan sitemap blogspot generator di bawah ini. Untuk membuatnya, buat laman baru lalu salin kode Javascript berikut:
<div id="sitemap">Loading...</div>
<script> //<![CDATA[
var start=1;var max=150;var sitemapArr=new Array();function runsitemap(){var scpt=document.createElement('script');scpt.src='/feeds/posts/summary?alt=json&callback=sitemap&start-index='+start+'&max-results='+max;document.body.appendChild(scpt)} function sitemap(root){var elem=document.getElementById('sitemap');if(!elem)return;elem.innerHTML='';var feed=root.feed;if(feed.entry.length>0){for(var i=0;i<feed.entry.length;i++){var entry=feed.entry[i];var title=entry.title.$t;for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=="alternate"){var url=entry.link[j].href;if(url&&url.length>0&&title&&title.length>0){sitemapArr.push({'url':url,'judul':title})} break}}} if(feed.entry.length>=max){start+=max;runsitemap()} else{var print='';for(var x=0;x<sitemapArr.length;x++){print+='<li><a href=\"'+sitemapArr[x].url+'\" title=\"'+sitemapArr[x].judul+'\">'+sitemapArr[x].judul+'</a></li>'}
elem.innerHTML='<div class=\"title\">Total Post: '+sitemapArr.length+'</div><ol>'+print+'</ol>'}}} runsitemap();
//]]> </script>
Setelah itu salin kode CSS ini di atas tag </style> atau ]]></b:skin>.
/* Sitemap Blogger Sederhana */
#sitemap .title {background-color:#448ccb; color:#fff; font-size:150%; font-weight:400; text-align:center; margin-bottom:20px; padding:15px;}
#sitemap a {color:#212121; text-decoration:none; transition:all .3s ease;}
#sitemap a:hover {color:#000;}
#sitemap ol {margin:0px; padding:0px;}
#sitemap ol li {color:#212121; font-weight:400; list-style-type:decimal; margin:0px; padding:10px; line-height:1.5em; -webkit-margin-start:40px !important;}
Demikian artikel tentang Cara Membuat Sitemap HTML di Blogspot yang dapat DemosWebId bagikan. Semoga dengan adanya artikel kali ini sangat bermanfaat untuk anda. Selamat mencoba.
Sumber : bisablog.com
0 Comments