Home Top Ad

IDCloudHost | SSD Cloud Hosting Indonesia

Cara Cepat Membuat Halaman Sitemap Blog Dengan Mudah

Share:
Halaman Sitemap www.udarozi.com
Rozipiliang.com- Sebelumnya saya telah bahas sebelumnya halaman-halaman yang sangat penting dalam sebuah blog, salah satunya dalah halaman sitemap. Sitemap adalah laman yang menunjukkan pengelompokan artikel berdasarkan dengan label masing-masing.

Sitemap sangat penting bagi pengunjung jika ingin melihat postingan kalian lebih banyak yang sudah dikelompokan menurut kategori masing-masing.

Sitemap ini bayak modelnya dan unik-unik, para suhu blogger telah pengembangkannya dengan kode html masing masing, namun kali ini saya akan memberikan kepada kalian kode html halaman sitemap yang sangat sederhana dan cantik.

Untuk mengaplikasikan kode hatml ini kalian tidak perlu susah susah merubanhya lagi, karena sudah bisa lansung di terapkan pada blog kamu tampa harus ada yang dirubah.

Langkah yang harus kalian lakukan adalah masuk pada akun blogger kalian, seterusnya kalian masuk Tab Halaman, kalian ambil yang mode penulisannya Html. Lihat Gambar Berikut :

Gambar 1
Gambar 2, Html Editor




Pada bagian judul diisi dengan tulisan "Sitemap". setelah kalian mengikuti langkah-langkah diatas, kalian tinggal paste-kan kode html berikut pada text editor tersebut.


<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>

Setelah memasukkan kode html pada text editor tadi, maka kalian tinggal menyimpan halaman tersebut.

Jika halaman tersebut telah tersimpan, maka langkah kalian untuk membuat halaman sitemap telah selesai. silahkan tampilkan halaman sitemap kalian pada main menu atau pada tempat yang kalian rasa cocok untuk posisinya ada mudah di akses oleh pengunjung. Semoga bermanfaaat.(rzpl)


2 comments: