Cara Membuat Sitemap Otomatis yang SEO di Halaman Blogger 2018

Anda para Blogger pasti sudah tidak asing lagi dengan yang namanya Sitemap. Kali ini saya ingin membagikan tutorial cara membuat sitemap otomatis yang SEO di Blogger 2018. Kita sudah sering sekali melihat tutorial membuat sitemap ini di Google, tetapi sayangnya lebih dari 60% diantaranya script sudah rusak, alias tidak work lagi.

Oleh karenanya kali ini saya ingin membagikan script nya yang masih work di tahun 2018. Sitemap juga sering disebut daftar isi.

Bila anda belum tau, sitemap merupakan sebuah widget yang akan menampilkan seluruh postingan yang pernah anda publikasikan di blog, dan postingan ini diurutkan berdasarkan label nya. Sitemap ini otomatis, jadi jika anda membuat postingan baru, postingan tersebut secara otomatis masuk ke daftar sitemap.

Anda sangat saya sarankan untuk memasang widget ini, karena sitemap berfungsi untuk mempermudah pengunjung untuk melihat semua postingan yang pernah anda buat, dan tentunya juga memberikan profit kepada anda yaitu Page Views semakin meningkat dan menurunkan bounce rate yang akan berdampak bagi SEO.

Kelebihan dari widget yang saya buat kali ini adalah responsif, jadi tampilannya tetap bagus dan keren walaupun dilihat melalui handphone dan laptop. Selain itu, ada beberapa kelebihan lainnya dari widget daftar isi yang saya buat kali ini, antara lain:

SEO Friendly
Fast Loading
Bisa dipasang kan LazyLoad ke dalamnya
Tampilan yang elegan
Cara memasang nya yang mudah
Mudah untuk diedit ulang atau redesain

DEMO

Langsung saja, berikut cara memasang daftar isi otomatis nya...

Cara Membuat Sitemap / Daftar Isi Otomatis yang SEO di Halaman Statis Blogger

Pemasangan Script Sitemap

Seperti biasa, pertama silakan anda masuk ke blogger.com, tekan Tema, dan pilih Edit HTML, cari kode berikut ini:

<head>

Bila tidak ada, berikut kode penggantinya:

<head>

Sebut saja kode diatas namanya HEAD. Bila sudah ketemu, silakan tempatkan kode berikut tepat dibawah kode HEAD tadi.

<style>
.kodejarwo-sitemap-list {}
.kodejarwo-sitemap-list ul {padding:0;margin:0;box-shadow:0 0 10px rgba(0,0,0,.2);}
.kodejarwo-sitemap-list ul li.judul {padding:10px 20px;list-style:none;margin:0;font-family:arial;font-size:17px;font-weight:700;text-transform:uppercase}
.kodejarwo-sitemap-list ul ul li.menu {list-style:none;margin:0;}
.kodejarwo-sitemap-list ul ul li a {padding:10px 30px;background:#454359;border-bottom:2px solid #3f3e4e;width:100%;color:white !important;display:inline-block}
.kodejarwo-sitemap-list ul ul li a:link {color:white !important;font-family:arial;font-size:15px}
.kodejarwo-sitemap-list ul ul li a:hover {opacity:0.8}
.kodejarwo-sitemap-list ul ul li a strong {float:right}
</style>
<script async='async' src='https://cdn.rawgit.com/BangJarwo/Kode-Jarwo/ba6b6cf5/Sitemap.js'></script>

Simpan template dan lanjut ke langkah berikutnya.

Penempatan Widget

Sekarang, anda dapat memilih dimana anda ingin menempatkan widget ini. Bisa lewat tata letak widget HTML/JavaScript, bisa juga pada halaman statis.

Memasang Sitemap / Daftar Isi di Halaman Statis

Masuk ke dashboard kiri blogger, pilih bagian Halaman, lalu buat halaman baru.

Setelah itu, masuk ke mode HTML. Lihat gambar dibawah ini untuk lebih jelasnya.

Lalu, masukkan kode berikut ini kedalam halaman mode HTML tadi:

<script src="/feeds/posts/default?max-results=9999&alt=json-in-script&callback=kodejarwoSitemap"></script>

Setelah itu, publikasikan halaman anda dan lihat hasilnya.

Memasang Sitemap / Daftar Isi di Widget

Masuk ke blogger.com, lalu pilih Tata Letak, tekan tambahkan widget. Setelah itu, pilih widget yang bernama HTML/JavaScript, dan masukkan kode berikut kedalamnya: