Membuat Sitemap Responsive untuk Blog

 

Apa itu sitemap ?

Sitemap adalah salah satu alat bantu untuk para webmaster yang mempermudah dalam pengenalan peta situs di dalam website. Dengan begitu, mesin google dengan mudah menjelajah dan meraih halaman-halaman yang ada di dalamnya.

Jenis-jenis sitemap

Secara umum, sitemap dibagi dalam dua kategori: XML sitemap dan HTML sitemap. Perbedaan utama kedua sitemaps ini adalah XML ditujukan untuk mesin pencari, sedangkan HTML dibuat untuk pengguna website.

• XML sitemap:

Seperti yang sudah dijelaskan, XML sitemap ditujukan untuk mesin pencari. Selain itu, XML juga berisikan metadata dengan URL website. Metadata berisikan seluruh informasi, termasuk kapan terakhir kali suatu URL di-update, seberapa cepat perubahan berlangsung, dll.

• HTML sitemap:

HTML sitemap ditujukan untuk pengguna. Selain itu, HTML juga memberikan navigasi yang lebih mudah. Sitemap ini juga mengarahkan pengguna untuk mengunjungi halaman Contact Us atau Shopping Cart, dll. Tidak diragukan lagi, HTML sitemap selain benar-benar dirancang untuk pengguna, tapi juga menaikkan ranking website karena website Anda lebih mudah digunakan.

Membuat html sitemap untuk blogger

Pada artikel kali ini saya akan membahas bagaimana membuat Sitemap HTML di blog. Untuk tampilannya bisa kalian lihat pada gambar berikut.

Tanpa berlama-lama lagi, ikuti step by step pemasangan Sitemap untuk blog berikut.

• Pertama, masuklah ke dashboard blog kalian.
• Buatlah sebuah halaman/page untuk menaruh Sitemapnya nanti.
• Gunakan mode html (jangan mode compose)
• Copy dan paste script berikut pada halaman dengan mode html tadi.

 <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: #3498DB;
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{text-transform:uppercase;}
.new{color:#FF5F00;font-weight:bold;font-style:italic;}
.postname{font-weight:normal;background:#fff;margin-left: 35px;}
.postname li{border-bottom: #ddd 1px dotted;margin-right:5px}
</style>
<br />
<div id="toc">
<script src="https://cdn.jsdelivr.net/gh/penaindigo/Pena-Indigo-Code@a134f9def601a6f77332eccc35d3d20e0d3c7e49/sitemappenaindigo.js" type="text/javascript"></script>
<script src="/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div> 

• Setelah di-paste, publishlah halaman tersebut.
• Langkah terakhir, ceklah halaman tersebut sudah tepat atau belum menjadi sitemap blog anda.

Demikian langkah-langkah mudah dalam membuat Sitemap untuk blog yang responsive. Semoga artikel yang saya bagikan ini bermanfaat bagi rekan-rekan semua. Jika masih ada kendala silakan berkomentar pada kotak komentar dibawah. Terimakasih.

sumber :
https://id.wikipedia.org/wiki/Sitemaps
https://www.hostinger.co.id/tutorial/cara-membuat-sitemap-wordpress/

Rekomendasi artikel untuk anda :