Sitemap dalam blogger merupakan sebuah halaman yang berisi daftar isi artikel secara keseluruhan yang pernah dipublikasikan oleh blog tersebut. Jadi pengertiannya sitemap itu merupakan halaman yang berisikan semua judul artikel didalam blog yang dipisahkan per label
Ada banyak cara dan juga ada banyak model tampilan halaman sitemap tergantung pada CSS dan JavaScript yang digunakan untuk membuat sitemap tersebut. Nah disini saya akan membagikan cara membuat sitemap seperti punya saya
Membuat sitemap responsive
Halaman sitemap yang saya gunakan memiliki tampilan yang simple, keren, dan tentunya responsive tidak membebani loading blog demo bisa [ lihat disini.. . ]
Jika kamu tertarik membuatnya bisa ikuti tutorialnya dibawah ini
Login blogger
Pilih menu Halaman
Buat Halaman baru beri judul sitemap/daftar isi
Copy paste kode dibawah ini. Letakkan di Html jangan di Compose
<div dir="ltr" style="text-align: left;" trbidi="on">
<style scoped="" type="text/css">
.table-of-content{background-color:#fff;color:#444;font-family:Verdana,Geneva,Tahoma,Arial,Sans-serif;font-size:13px;font-weight:400;overflow:hidden;border-radius:4px;box-shadow:0 0 10px rgba(0,0,0,.2)}
.table-of-content .toc-header{color:#444;font-family:inherit;font-weight:400;font-size:14px;background-color:#fff;margin:0;padding:15px;overflow:hidden;cursor:pointer;border-bottom:1px solid #ccc;transition:initial}
.table-of-content .toc-header:hover{background-color:#fdfdfd}
.table-of-content .toc-header:before{content:'';width:0;height:0;position:absolute;top:22px;right:15px;border:5px solid transparent;border-color:#aaa transparent transparent;transition:all .3s ease}
.table-of-content .toc-header.active{color:#fc4f3f}
.table-of-content .toc-header.active:before{border-color:#666 transparent transparent;top:16px;-webkit-transform:rotate(-180deg);-moz-transform:rotate(-180deg);-ms-transform:rotate(-180deg);-o-transform:rotate(-180deg);transform:rotate(-180deg)}
.table-of-content .loading{display:block;padding:15px;text-decoration:blink}
.table-of-content ol{margin:0;padding:0;list-style:none;transition:initial}
.table-of-content li{line-height:normal!important;margin:0!important;padding:8px 8px 8px 15px!important;white-space:nowrap;text-align:left;overflow:hidden;background:#444359!important;transition:initial}
.table-of-content a{color:#d9d9d9;text-decoration:none;font-size:86%;transition:initial}
.table-of-content a:visited{color:#a2a2a9;transition:initial}
.table-of-content a:hover,.table-of-content a:visited:hover{color:#ffc937;text-decoration:none;transition:initial}
.post ol li:before{display:none}
</style>
<div class="table-of-content" id="table-of-content">
<span class="loading">Memuat konten...</span></div>
<script>
var toc_config = {
url: 'https://www.larepacitan.com/',
containerId: 'table-of-content',
showNew: 15,
newText: ' <strong style="font-weight:normal;font-style:normal;color:#fff;font-size:11px;background:#5c5a78;padding:1px 6px 3px 6px;line-height:normal;float:right;border-radius:3px;">baru</strong>',
sortAlphabetically: {
thePanel: true,
theList: true
},
maxResults: 9999,
activePanel: 1,
slideSpeed: {
down: 400,
up: 400
},
slideEasing: {
down: null,
up: null
},
slideCallback: {
down: function() {},
up: function() {}
},
clickCallback: function() {},
jsonCallback: '_toc',
delayLoading: 0
};
</script>
<script src="https://cdn.rawgit.com/Arlina-Design/redvision/master/daftar-isi-tea.js"></script>
</div>
Sebelum menyimpan terlebih dahulu ganti alamat URL blog ini yang saya tandai warna merah, dengan alamat URL blog kamu
Kemudian simpan dan selesai.
Gimana simple tidak? cara membuat halaman sitemap diatas. Diatas juga merupakan cara yang saya terapkan untuk membuat halaman daftar isi di blog yang kalian baca saat ini, jika tampilanya tidak sama atau kamu ingin sedikit tampilan yang berbeda kamu bisa berkreasi dengan mengubah kode cssnya
Sitemap penting untuk daftar Adsense
Menurut beberapa blogger halaman sitemap merupakan halaman yang sangat krusial jika blog mau didaftarkan ke Google adsense, konon tanpa halaman ini permohonan untuk mengajukan monetisasi blog bisa saja ditolak.
Pengalaman pribadi setiap kali saya mau daftar Google adsense, blog punya saya pasti sudah di lengkapi menu Sitemap yang berisikan daftar isi artikel seperti yang telah saya paparkan. Belum pernah saya mendaftar untuk menjadi partner Adsense tanpa menyediakan halaman sitemap, jadi jika ditanya tentang hal ini kemungkinan besar saya mempercayai nya
Halaman Sitemap di blog menurut saya
Di sediakan nya semua properti yang ada didalam blog tujuan utamanya untuk memudahkan para pengunjung, tidak terkecuali sebuah halaman yang berisikan daftar isi
Maka dari itu jika pengunjung blog ingin tau/mengetahui artikel apa aja sih yang dipublikasikan blog ini? maka mereka tinggallah pencet menu Sitemap seketika mereka tau oh ini semua artikel yang ada didalam blog ini. Jadi menurut saya halaman ini tidak kalah penting dengan halaman About Us maupun Contact Us
Itu aja sih postingan singkat kali ini semoga membantu, jika punya pertanyaan atau pendapat lain bisa ditinggalkan di kolom komentar