Sitemap SEO atau daftar isi blog dirasa sangat penting untuk memberikan ruang informasi kepada pengunjung agar mengetahui seluruh isi artikel pada blog Sitemap SEO.
Kali ini saya akan memberikan tutorial cara membuat sitemap keren otomatis dan fast loading di blog. Sebenarnya sitemap default dari blogger sudah tersedia, namun terlihat biasa dan tidak menarik.
Sitemap SEO
Nah, dengan membuat sitemap blog keren maka akan menajadi perhatian tersendiri dimata pengunjung dan ini akan menjadikan pengunjung betah di blog yang kita kelola.
Memasang sitemap
pada blog merupakan hal yang sangat penting demi kemudahan bagi para pengunjung dalam menemukan artikel yang dicari.
Sitemap atau peta situ adalah sebuah peta yang berisikan berbagai macam direktori atau konfigurasi konten maupun artikel dari sebuah web / blog dalam bentuk tautan link.
Pembuatan sitemap juga bertujuan untuk mempermudah melakukan crawl (perayapan) yang dilakukan oleh search engine.
Responsive Fast Loading
Berikut beberapa koleksi dari Mboton untuk membuat sitemap keren. pilih salah satu sitemap dibawah ini lalu pasang pada laman blog anda. Jika anda memasang dengan benar maka sitemap sudah berhasil anda pasang di blog.
Sitemap SEO yang akan kita buat saya terapkan di blog ini (Dua Cara Pasang), jadi Anda dapat melihat hasilnya langsung di halaman sitemap blog ini.
Beberapa kelebihan sitemap
- Update otomatis setiap ada posting baru
- Tampilan yang simpel dan sederhana
- Ringan, tidak memberatkan blog
- Fast Loading, cepat
- Posting dikelompokkan per label
- 100% SEO friendly
- Valid HTML 5
- Valid CSS
Tanda khusus pada postingan terbaru
- Pada Dashboard Blogger, pilih Posts atau Pages. Saran saya, buat di Pages agar URL sitemap lebih singkat. Pilih New Page.
Beri judul pada halaman sitemap Anda. Pilih Mode HTML, kemudian masukkan script sitemap di bawah ini.
<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>
<div id="toc">
<script src="https://cdn.rawgit.com/penaindigo/Pena-Indigo-Code/a134f9de/sitemappenaindigo.js" type="text/javascript"></script>
<script src="https://www.mboton.net/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script></div>Sitemap SEO Two 2
Beri judul pada halaman sitemap Anda. Pilih Mode HTML, kemudian masukkan script sitemap di bawah ini.
<link href="https://cdn.rawgit.com/mboton/project/d4a73206/mbotonnet.css" rel="stylesheet"></link>
<div class="tabbed-toc" id="tabbed-toc">
<span class="loading">Memuat…</span></div>
<script>
var tabbedTOC = {
blogUrl: "https://www.mboton.net/", // Blog URL
containerId: "tabbed-toc", // Container ID
activeTab: 1, // The default active tab index (default: the first tab)
showDates: false, // `true` to show the post date
showSummaries: false, // `true` to show the posts summaries
numChars: 200, // Number of summary chars
showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
thumbSize: 40, // Thumbnail size
noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC", // A "no thumbnail" URL
monthNames: [ // Array of month names
"Januari",
"Februari",
"Maret",
"April",
"Mei",
"Juni",
"Juli",
"Agustus",
"September",
"Oktober",
"November",
"Desember"
],
newTabLink: true, // Open link in new window?
maxResults: 99999, // Maximum post results
preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
sortAlphabetically: true, // `false` to sort posts by published date
showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked
newText: ' – <em style="color:red;">New!</em>' // HTML for the "New!" text
};
</script>
<script src="//cdn.rawgit.com/tovic/dte-project/2fd2d2971c3398029ea5e149696447243e7f4d94/tabbed-toc.min.js"></script>
Sitemap SEO Sekian dari saya Mboton semoga berguna untuk kita semua semoga berhasil untuk menerapkan tutorial ini semua silakan berkomentar atau bertanya lewat email kontak di atas tersebut. Terima Kasih
