Cara membuat sitemap / peta situs otomatis pada blog kita (Blogger)

Baca Juga

 Sitepmap atau peta situs adalah rincian atau daftar postingan pada sebuah situ yang biasanya di klasifikasi berdasarkan label, contoh site map https://www.ydprog.com/ seperti berikut :

Sitemap menampilkan postingan postingan saya yang diurutkan sesuai abjad (LABEL) postingan.

dapat dilihat contohnya pada gambar diatas pada label Android : memiliki  11 Postingan, dilanjutkan dengan label Campuran dibawahnya. Sitemap dibuat secara otomatis tanpa kita harus memasukan listnya secara manual sehabis kita memposting sebuah artikel dan lainnya.

Jika artikel baru atau baru di post maka akan ada tanda News artinya akan membuat keterangan sendiri bahwasanya artikel atau tulisan tersebut baru saja atau tidak lama diposting.

Seperti gambar berikut ini :

Sitemap juga menjadi syarat yang harus ada jika blog atau website anda ingin didaftarkan pada google adsense sehingga google menyetujui untuk menampilkan iklan pada blog kita.

Lihat cara bagaimana mendaftar adsense : https://www.ydprog.com/2021/08/cara-mendaftar-google-adsense-terbaru.html

bagaimana cara membuat sitemap otomatis ?

Mari kita simak bersama :

1. Masuk Blogger

akses https://www.blogger.com/ lalu signin atau masuk dengan akun yang sudah terdaftar.

2. pilih halaman atau page

Kita akan membuat sitemap menggunakan halaman , saya sarankan jangan menggunakan postingan ya.

Setelah itu buat halaman baru dengan  klik + Halaman baru, seperti gambar berikut ini :

maka akan membuat sebuah halaman kosong seperti gambar berikut :

isikan pada kolom judul dengan 'Sitemap', seperti gambar berikut ini :

Setelah itu kita menulis kodenya, namun sebelumnya harus mengganti tampilan menulis biasa menjadi menulis HTML , bagaimana caranya ?

klik icon pensil pada bagian paling kiri tools blogger, kemudian ganti dari Tampilan menulis menjadi tampilan HTML, seperti berikut :

kemudia kita lihat halaman untuk memposting berberda dari sebelumnya, seperti gambar berikut :

Di atas adalah tampilan kita menulis menggunakan kode kode . bersihkan halaman menulis terlebih dahulu dengan ctrl+A atau blog semua daam kolom lalu hapus.

Jika sudah , copy dan tempelkan kode berikut di dalam form menulis HTML.

<h1 style="height: 0px; text-align: left;">Sitemap<br /></h1><div><br /></div><div><br /></div><div><br /></div><div><br /></div>

<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 copy langsung di tempelkan, tampak seperti gambar dibawah ini :

Kemudian klik Publikasi atau perbarui.

Sekarang langsung lihat hasilnya ya !

Dan jadideh sitemapnya , ini hasil di https://www.ydprog.com/

Lihat sitemap saya : https://www.ydprog.com/p/sitemap.html

Selesai ...

demikian informasi kali ini semoga bermanfaat.