Cara Membuat Sitemap Paling Keren Satu Label Saja di Blogger
Sitemap satu label adalah daftar isi blog yang menyantumkan postingan atau artikel hanya satu label saja, seperti yang kita ketahui sitemap akan menampilkan seluruh artikel berdasarkan label. Namun ada beberapa orang yang ingin menampilkan sitemap hanya per kategori atau per label saja.
Pada kesempatan yang ceria ini saya akan memberikan tutorial membuat sitemap satu label yang super keren untuk blog blogger atau blogspot. Ini sebagai janji saya kepada pembaca blog Pena Indigo yang menanyakan tentang cara membuat sitemap satu label saja.
Atau jika anda ingin koleksi sitemap keren dan otomatis di blog silahkan pada tutorial tersebut akan menampilkan sitemap secara keseluruhan (menampilkan sitemap berdasarkan label).
Atau jika kebetulan anda menggunakan platform wordpress bisa menggunakan tutorial yang sudah saya buat
Sitemap satu ini sudah memiliki fasilitas fast loading dan responsive jadi dapat diakses dari berbagai perangkat. Agar lebih jelas berikut tampilannya:
Kodenya dibawah ini:
<style type="text/css">
#penaindigocom{background:#fff;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);}
judule{color:#FFF;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;}
ol{font-weight:normal;background:#fff;margin-left: 35px;}
ol li{border-bottom: #ddd 1px dotted;margin-right:5px;padding:3px}
</style>
<div id="penaindigocom">
<script src="https://cdn.jsdelivr.net/gh/penaindigo/pi-project@ce599c1082b28f589ee0582485dc661a3f9ba15c/sitemapsatulabel.js">
</script>
<judule>Blogging</judule>
<ol>
<script src="/feeds/posts/default/-/Blogger?orderby=published&alt=json-in-script&callback=startpost&max-results=999">
</script>
</ol>
</div>
Keterangan:
- Blogging: Judul Label
- Blogger: Nama Label
Memasang Sitemap dengan Beberapa Label Pilihan
Anda juga bisa menambahkan beberapa label pilihan, sebagai contoh anda ingin menampilkan 2 label atau 3 label saja. Maka cukup menambahkan kode berikut sebelum kode <div>
<judule>Blogging</judule>
<ol>
<script src="/feeds/posts/default/-/Blogger?orderby=published&alt=json-in-script&callback=startpost&max-results=999">
</script>
</ol>Jadi jika dipasang akan seperti ini langsung praktek ini kodenya:
<style type="text/css">
#penaindigocom{background:#fff;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);}
judule{color:#FFF;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;}
ol{font-weight:normal;background:#fff;margin-left: 35px;}
ol li{border-bottom: #ddd 1px dotted;margin-right:5px;padding:3px}
</style>
<div id="penaindigocom">
<script src="https://cdn.jsdelivr.net/gh/penaindigo/pi-project@ce599c1082b28f589ee0582485dc661a3f9ba15c/sitemapsatulabel.js">
</script>
<judule>Tips dan Trik</judule>
<ol>
<script src="/feeds/posts/default/-/Tips dan Trik?orderby=published&alt=json-in-script&callback=startpost&max-results=999">
</script>
</ol>
<judule>Tools</judule>
<ol>
<script src="/feeds/posts/default/-/Tools?orderby=published&alt=json-in-script&callback=startpost&max-results=999">
</script>
</ol>
</div>
Maka hasilnya seperti langsung dipraktekan ya dijamin keren:
Cara Memasang Sitemap Paling Keren Per Label (Kategori) di Blogger
- Silahkan login akun Blogger.
- Kemudian pilih menu Pages lalu pilih New page
- Kemudian pilih mode HTML
- Silahkan isi judul page dengan Sitemap atau Daftar isi
- Lalu masukkan kode diatas pada kolom HTML
- Terakhir klik Publish dan lihat hasilnya.
Demikian penjelasan tentang sitemap satu label, semoga dapat bermanfaat dan menjadi pilihan sitemap yang sesuai dengan keinginan anda.
Jangan lupa juga baca artikel menarik lainnya sesuai dengan kebutuhan anda. Atau jika ingin request tutorial silahkan kirim pesan melalui halaman kontak yang sudah tersedia terima kasih.
Comments