MEMBUAT SITEMAP DENGAN MODE TABLE BLOGGER

Membuat Sitemap Dengan Mode Table Blogger, ini sangat sederhana sekali cara membuatnya. Hampir semua blogger sudah pada tau tentang apa itu sitemap?, tapi jika Anda masih binggung cara membuatnya berikut saya share kepada Anda tutorialnya :

1. Login akun Blogger Anda
2. Langkah selanjutnya Anda masuk ke My blogs -> Pages
3. Buatlah Pages baru dengan pages kosong, masukkan kode berikut ini



<div id="bp_toc">
Loading Sitemap. Please wait...</div>
<script src="http://dl.dropboxusercontent.com/u/35029438/share/sitemap/sitemap-table-mode.js" type="text/javascript"></script>
<script src="/feeds/posts/summary?alt=json-in-script&amp;max-results=500&amp;callback=loadtoc" type="text/javascript"></script>


Ingat,..cara memasukkan kodenya Bukan di Compose tapi di HTML, jika sudah Anda masukkan kodenya dengan benar baru Anda klik Publish.


4. Selanjutnya cari kode ]]></b:skin> di template Anda
5. Kemudian Anda masukkan kode di bawah ini tepat di atas kode ]]></b:skin>



/* Archive */
#bp_toc {border:0 solid #000000; background:#ffffff; padding:10px 0; width:100%;}
#bp_toc a {text-decoration:none !important;}
#bp_toc a:hover {text-decoration:underline !important;}
.toc-header-col1,.toc-header-col2,.toc-header-col3 {padding:10px; background:#292929; width:250px; border-bottom:5px solid #ff6633;}
.toc-header-col2 {border-right:2px solid #ffffff; border-left:2px solid #ffffff;}
.toc-header-col2 {width:75px; border-bottom:5px solid #FFFFFF;}
.toc-header-col1 {width:600px;}
.toc-header-col3 {width:245px;}
.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-family:"Trebuchet MS",sans-serif; font-size:14px; font-weight:bold; line-height:1.4em; font-style:normal; border-collapse:separate; color:#ebebeb; text-decoration:none;}
.toc-header-col1 a:hover,.toc-header-col2 a:hover,.toc-header-col3 a:hover {text-decoration:underline;}
.toc-entry-col1,.toc-entry-col2,.toc-entry-col3 {padding:10px; background:#f8f8f8; border-bottom:2px solid #ffffff;}
.toc-entry-col2 {border-right:2px solid #ffffff; border-left:2px solid #ffffff;}
.toc-entry-col1 a,.toc-entry-col2 a,.toc-entry-col3 a {color:#45818e; font-size:12px; font-family:verdana;  }
.toc-note {background-color:#333333; padding:10px; font-size:20px; display:inline-block; *display:inline; zoom:1; text-align:center; color:#999999;}



6. Kemudian simpan template Anda, lihat hasilnya pasti keren hehehe...

Untuk Demonya bisa Anda lihat dengan mengklik tombol demo di bawah ini :

• Demo

Selamat mencoba...

Advertise

Contact Me

300x250

Advertise

Contact Me

300x250