--> Skip to main content

Cara Membuat Sitemap Keren Berdasarkan Label dan Kata Kunci di Blog

Cara Membuat Sitemap Keren Berdasarkan Label dan Kata Kunci di Blog -- Sebuah sitemap merupakan hal wajib yang harus dilengkapi oleh sebuah situs. Dengan adanya sitemap yang dimiliki oleh sebuah situs maka pengunjung akan mendapatkan kemudahan untuk mengeksplorasi seluruh isi artikel yang dimiliki oleh sebuah situs. Berangkat dari situ demi memberikan kenyamanan kepada pengunjung dalam melihat-lihat seluruh isi situs maka banyak dari designer template dan mastah blogging memberikan tutorial cara membuat sitemap keren di blog. Tujuannya adalah memberikan efek suka dan nyaman dalam membaca keseluruhan isi situs. Sitemap yang sedang diburu-buru adalah sitemap keren berdasarkan kategori. Kategori yang dimaksud adalah label dari artikel dengan dilengkapi waktu dimana artikel tersebut diterbitkan. Sehingga semakin mudah dalam mencari artikel dalam sebuah situs.

Dengan adanya sitemap dalam sebuah situs diharapkan agar pengunjung mau berlama-lama didalam sebuah situs. Alhasil traffik akan meningkat tajam. Namun, di Indonesia sendiri keberadaan peta situs/daftar isi/sitemap ini kurang begitu berjalan. Kurang tahu apa alasannya namun jangan khawatir meski demikian banyak blogger dalam negeri senang memasang menu tersebut. Bagaimana cara membuatnya di blog? Yuk mari ikuti tutorial kali ini.

Cara Membuat Sitemap Keren Berdasarkan Label/Kategori dan Kata Kunci/Keyword Keren di Blog

Semoga dengan tutorial kali ini sobat dapat memiliki sitemap blog berkategori yang keren berdasarkan label dan keyword sehingga pengunjung akan sangat mudah dalam mencari artikel didalam sebuah situs. Berikut step-step membuatnya:

1. Sign in ke Blogger.com
2. Arahkan ke menu Template
3. Klik Edit HTML
4. Cari Kode ]]></b:skin> atau </style> dengan bantuan CTRL + F agar lebih cepat
5. Copy dan Pastekan kode di bawah ini tepat diatas kode tersebut.

/* CSS Sitemap */
#table-outer table{width:100%;margin:0;padding:0}
#table-outer input,#table-outer select{padding:4px;font:inherit;border:2px solid #ecf0f1;width:170px;box-sizing:border-box}
#table-outer select{cursor:pointer;outline:none}
#table-outer input:focus{outline:none}
#resultDesc{margin-bottom:10px}
#feedContainer{overflow:hidden;margin-top:20px}
#feedContainer strong{font-size:10px}
#feedContainer,#feedContainer li{padding:0;margin:0;list-style:none}
#feedContainer li{float:left;width:50%;margin-bottom:10px;position:relative;z-index:0}
#feedContainer .inner{padding:8px;margin:0 5px;position:relative;background-color:#fff;border:1px solid #f9f9f9;height:133px}
#feedContainer img{float:left;margin:0 8px 0 0;max-width:100%;border:1px solid #f9f9f9;padding:2px}
#feedContainer .toc-title{max-height:33px;overflow:hidden}
#feedContainer .toc-title:hover{text-decoration:underline}
#feedContainer .news-text{font-size:11px}
#feedNav a,#feedNav span{display:block;text-align:center;color:#fff;text-decoration:none;background-color:#444;padding:5px;width:95%;margin:0 auto;transition:all 0.3s linear}
#feedNav a,#feedNav span:hover{background-color:#333;transition:all 0.3s linear}
#feedContainer .date{display:none;position:absolute;bottom:0;right:0;background-color:transparent;color:#fff;font-size:9px;padding:3px 2px;width:35px}
#feedContainer .date .dd{font-size:9px;line-height:5px;font-weight:bold}
#feedContainer .date span{display:inline-block;line-height:5px;text-align:center;margin-left:5px}

Setelah script di atas sudah dimasukkan kedalam kode HTML maka jangan lupa klik Simpan agar data yang dimasukkan tersimpan dengan benar. Tahap selanjutnya buat lah halaman statis baru di situs sobat masing-masing. Caranya:

1. Dari dashboard Blog arahkan ke Menu Laman/Page
2. Klik New Page untuk menambahkan Laman Baru
3. Berikan Nama Judul dengan Sitemap/Daftar Isi/Peta Situs
4. Arahkan dan Klik HTML bukan Compose
5. Pastekan Kode dibawah ini.

<div id="table-outer">
<table><tbody>
<tr><td><label>Sort posts by : </label></td><td><select id="orderFeedBy"><option selected="" value="published">New post</option><option value="updated">Post updated</option></select></td></tr>
<tr><td><label>Filter posts by category : </label></td><td><span id="labelSorter"><select disabled=""><option selected="">Loading...</option></select></span></td></tr>
<tr><td><label>Search by keyword : </label></td><td><form id="postSearcher">
<input type="text" /></form>
</td></tr>
</tbody></table>
</div>
<br />
<header id="resultDesc"></header>
<br />
<ul id="feedContainer"></ul>
<div id="feedNav">
Loading...</div>
<script src="https://arlina-design.googlecode.com/svn/tocs.js" type="text/javascript"></script>
<style scoped="" type="text/css">
#comments {display:none;}
</style>

Terakhir, jika sudah maka jangan lupa tekan Publish Laman. Lihat Hasilnya dengan Klik link berikut


Demikianlah cara membuat sitemap keren berdasarkan label dan kata kunci di blog. Semoga bermanfaat.

Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar