Cara Buat Sitemap Di Blog Dalam Bentuk Halaman Mudah Dan Praktis

Sahabat, Kang oim memang tidak capek-capeknya ingin memberikan inspirasi buat kalian, khususnya yang baru membangun blog, agar nantinya terlihat terlebih profesional.

Tapi, apakah Sitemap itu? Sebenarnya ada dua istilah sitemap dalam dunia blog yang perlu agan pahami, yaitu :

• Sitemap yang berfungsi sebagai perayapan mesin pencari, baik google maupun Bing dan lain-lain
• Sitemap dalam artian daftar isi atau halaman yang berisi list postingan yang ada pada sebuah blog., sobat bisa lihat di blog ini.

Nah, dalam tulisan ini, saya akan membahas poin kedua, yakni sitemap yang berupa halaman khusus, dan didalamnya terdapat daftar isi dari seluruh poostingan / tulisan yang di publish sesuai dengan kategori masing-masing, untuk lebih jelasnya, silahkan sobat lihat sitemap pada blog ini.

Perlu diketahui, Blog yang memiliki atribut recomended terutama memiliki halaman sitemap, supaya pengunjung bisa mengetahui segala informasi yang sudah tertulis di blog.

Selain itu Sitemap yang akan saya bagikan ini juga secara otomatis akan menampilkan postingan, sesuai dengan label/ kategorinya.

Seperti halnya kita membaca buku, dan mencari satu topik, maka kita biasanya merujuk pada daftar isi yang disediakan. Sehingga, kita bisa dengan mudah mencari topik yang sedang dicari.

Dengan begitu, tentu pengunjung bisa dipastikan lebih kerasan di blog, dan pada akhirnya rating blog akan semakin meningkat.

Ok, untuk lebih jelasnya, silahkan ikuti tutorial berikut ini :

• 1. Login ke blog sobat, kunjungi www.blogger.com
• 2. Selanjutnya, buatlah halaman baru, dan beri judul Peta Blog / Sitemap, biarkan saja seperti itu
• 3. Kemudian, copy kode dibawah ini, di halaman tersebut, dengan mode HTML, kemudian publikasikan

<div id="bp_toc">

</div>

<script src="https://cdn.rawgit.com/Arlina-Design/redvision/master/sitemap-content.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&amp;max-results=9999&amp;callback=loadtoc" type="text/javascript"></script>

<style scoped="" type="text/css">

#comments {display:none;}

</style>

• 4. Sekarang menuju ke Template/ Tema
• 5. Klik "Edit HTML"
• 6. Cari Kode </style>, gunakan control+F, agar mudah untuk mencarinya. Jika sudah ketemu, copy kode dibawah ini, dan pastekan, tepat diatas </style> tersebut.

/* CSS Full Sitemap */

#bp_toc {background:#ffaaa4;color:#666;margin:0 auto;padding:5px;}

span.toc-note {padding:20px;margin:0 auto;display:block;text-align:center;color:#ffcfcc;font-family:'Open Sans';font-weight:700;text-transform:uppercase;font-size:30px;line-height:normal;}

.toc-header-col1 {padding:10px;background-color:#f5f5f5;width:250px;}

.toc-header-col2 {padding:10px;background-color:#f5f5f5;width:75px;}

.toc-header-col3 {padding:10px;background-color:#f5f5f5;width:125px;}

.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {font-size:13px;

text-decoration:none;color:#aaa;font-family:'Open Sans';font-weight:700;letter-spacing: 0.5px;}

.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {

text-decoration:none;}

.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {background:#fdfdfd;padding:5px;padding-left:5px;font-size:89%}

.toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a{color:#666;font-size:13px;}

.toc-entry-col1 a:hover, .toc-entry-col2 a:hover, .toc-entry-col3 a:hover{color:#e76e66;}

#bp_toc table {width:100%;margin:0 auto;counter-reset:rowNumber;}

.toc-entry-col1 {counter-increment:rowNumber;}

#bp_toc table tr td.toc-entry-col1:first-child::before {content: counter(rowNumber);min-width:1em;margin-right:0.5em;}

td.toc-entry-col2 {background:#fafafa;}

Simpan, dan lihat halaman sitemap yang sudah dibuat, bagus kan?.

Perlu diketahui, kode-kode tersebut saya adopsi dari sumber terpercaya, yakni dari Arlina Design, dan ternyata dengan semakin canngihnya bahasa HTML, kode diatas, hingga saat ini masih bisa digunakan.

Demikianlah tutorial tentang Cara Buat Sitemap Di Blog Dalam Bentuk Halaman, semoga bisa memberikan inspirasi baru buat blog kalian sahabat.

Oya, apakah sahabat sudah tau cara membuat atribut-atribut wajib lainnya? coba deh baca tutorialnya, misalnya tentang membuat hamalan "About/ Tentang", Membuat Privacy dan Disclaimer Blog dan bikin Kontak dengan mudah dan efisien.

Berbagi :

Anda mungkin menyukai postingan ini :

• 
  Blogger Sehat, Sisi Lain Dari Blogger
• 
  Cara Modifikasi Recent Post dan Memasangnya di Blogger
• 
  Lima Penyedia Deteksi dan Cek Copypaste
• 
  Ingin Hilangkan Tab Atas Blog? Ini Caranya