Cara Membuat Sitemap Keren Untuk Blogger

siapa sih yang tidak mau blog nya kelihatan keren nah oleh karne itu saya di sini akan membagigkan sitemap keren untuk kalian gunakan agar blog kamu agak keren tetapi sebenarnya penguna wordpress mohon bersabar saya hanya membagi untuk bloggspot saja tapi nanti saya akan membagigkan untuk wordpress

di era digital sekarang banyak orang berbondong - bondong untuk membuat blog untuk pengasilan tetep tapi dilain itu kita juga membutuhkan sitemap yang keren untuk melekapinya, nah kalini saya akan membagigkan sitemap keren untuk blogger

kita perlu membuat sitemap agar pengunjung blog kita tidak bingung untuk mencari semua artikel kita, pada intinya ini memudahkan navigasi blog kita seperti contoh dibawah ini saya mengunakan sitemap keren.

cara yang saya bagigkan ini sanggat mudah untuk cara pemasanganya kalian tidak perlu pusing untuk mencoding sitemap ini pada dasarnya kalian hanya perlu coppy paste untuk mendapatkan sitemap keren untuk kalian pasangkan di blog kalian agar lebih menarik untuk di kunjungi seseorang dan memudahkan navigasi blog biar pengunung betah di blog kita.

Cara Membuat Sitemap Keren Untuk Blogger

cara ini bisa anda praktekan di semua template dan untuk hasilnya akan sama semua seperti contoh gambar diatas

1. Buka dasboard blogger kalian

2. Buat halaman baru

3. Pindah Mode Html

4. Msukan Judul

5. coppy script ini

<div class="jontor">
<script src="https://rawgit.com/rezamuhamad/rakinfo/master/sitemap.js"></script>
<script src="/feeds/posts/default?max-results=5000&amp;alt=json-in-script&amp;callback=rak_info_Load"></script>
</div>
<style type="text/css">.jontor{width:100%;border-collapse:collapse;text-align:left;overflow:hidden;margin:0 auto;}
.jontor a{color:black;}
.jontor p .rak_info_Label{background:#89abbc;color:#fff;text-decoration:none;display:block;padding:5px 0px 5px 10px;font:13px 'Arial';font-weight:bold;}
.jontor ol li{position:relative;display:block;padding:.4em .4em .4em .4em;margin:.5em 0 .5em 2.5em;background:#d9f4f2;color:#fff;text-decoration:none;transition:all .3s ease-out;}
user agent stylesheetli{display:list-item;text-align:-webkit-match-parent;}
.jontor ol li:before{content:counter(li);counter-increment:li;position:absolute;left:-2.5em;top:50%;margin-top:-1em;background:#89abbc;color:#fff;height:2em;width:2em;line-height:2em;text-align:center;font-weight:bold;}
.jontor ol li:hover:after{left:-.5em;border-left-color:#89abbc;}
.jontorol li:hover{box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);transition:all 0.3s cubic-bezier(.25,.8,.25,1);}
.jontor ol li:after{position:absolute;content:'';border:.5em solid transparent;left:-1em;top:50%;margin-top:-.5em;transition:all .3s ease-out;}
ol{counter-reset:li;list-style:none;font:12px 'Arial';padding:0;margin-bottom:2em;text-shadow:0 1px 0 rgba(255,255,255,.5);margin-left:26px;}
.rak_info_Postname li:nth-of-type(odd){background:#f1f3f3;}
.new{color:red!important;font-weight:700;font-style:italic;}
user agent stylesheetol{display:block;list-style-type:decimal;-webkit-margin-before:1em;-webkit-margin-after:1em;-webkit-margin-start:0;-webkit-margin-end:0;-webkit-padding-start:40px;}
</style>

6. Lalu Kalian Pastekan saja di halaman

kalian bisa menekan ctrl + V untuk mepastekan kode tersebut tingal itu saja yang perlu kalian lakukan

7. Cobalah

gimana untuk cara pemanangan nya mudah bukan jika ini terasa sulit ya kalian baca ulang article yang saya bagigkan ini ,jika sudah berhasil kalian tinggal untuk memasang nya di navigasi blog atau footer blog kalian jika ada masalah tinggalkan di kolom komentar ya, dan juga