25.3.14

Cara Membuat Daftar Isi Atau Sitemap Blog Di Blogspot

Cara Membuat Daftar Isi Atau Sitemap Blog Di Blogspot
Belum bosan Ngeblog? Janganlah merasa bosan ya, teruslah berbagi dan berkreasi melalui media blog ini dan yakinlah dengan apa yang kita lakukan ini bahwa suatu saat nanti akan membawa kita pada sebuah keberhasilan. Karena sekecil apapunn yang kita lakukan, tak aka nada yang menjadi sia-sia karenanya. Oke, berikut ini saya akan coba share tentang cara membuat sebuah daftar isi atau sitemap, yang mana halaman sitemap atau daftar isi ini dipandang perlu sekali keberadaannya dalam sebuah halamann blog.

Setelah kemarin memposting tentang cara mengatur dan menjadwalkan postingan blog, maka kali ini tak tanggung-tanggung saya akan memberikan dua jenis atau dua bentuk sitemap (daftar isi) kehadapan sahabat semua. Silahkan Anda bias memilih salah satunya untuk Anda terapkan kedalam halaman blog kesayangan anda. Langsung saja inilah:

Cara Membuat Daftar Isi Atau Sitemap Blog Di Blogspot


 ‘Masuk’ kedalam dasbor blog, pililh ‘Halaman’ lalu buat sebuah halaman baru. Ubah mode penulisan dari ‘Compose’ ke mode ‘HTML’. Beri judul dengan nama ‘Daftar ISi’ atau “Sitemap” pada bagian judul halaman tersebut. Lalu pastekan salah satu dari dua kode yang terdapat dibawah ini kedalam penulisan daftar isi.

Kode1

<div dir="ltr" style="text-align: left;" trbidi="on">
<style scoped="scoped" type="text/css">
#show-cat{float:left;margin-right:20px;width:220px;height:691px;overflow-x:hidden;overflow-y:auto;line-height:18px}
#show-cat ul{margin:0;border-top:1px solid #ccc;padding:0}
#show-cat ul li{list-style-type:none;margin:0;border-right:1px solid #ccc;border-bottom:1px solid #ccc;border-left:1px solid #ccc;padding:0}
#show-cat ul li a{display:block;padding:10px}
#show-cat ul li a,#navi-cat a{background:#fff;color:#d80556;text-decoration:none}
#show-cat ul li a,#navi-cat a,#navi-cat span{font-size:12px}
#show-cat ul li a:hover,#navi-cat a:hover{background:#ccc;color:#fff}
#show-post{float:left;width:60%}
#show-post ul li{list-style-type:none}
#navi-cat{padding:20px 0}
#navi-cat a{margin-right:10px;border:1px solid #ccc}
#navi-cat a,#navi-cat span{padding:5px 10px}
#navi-cat span{float:right}
</style>

<div id="show-cat">
</div>
<div id="show-post">
<script type="text/javaScript">
var cat_home='http://www.mochadnan.com';cat_numb=11;cat_pre='Prev';cat_nex='Next';
var cat_name;var cat_start;var cat_class;
function show_post2(a){var tt=a.feed.openSearch$totalResults.$t;dw='';dw+='<ul>';for(var i=0;i<cat_numb&&i<a.feed.entry.length;i++){var entry=a.feed.entry[i];cat_title=entry.title.$t;for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=='alternate'){var cat_url=entry.link[j].href}}dw+='
<li>';dw+=(cat_start+i)+'. <a href="'+cat_url+'" rel="nofollow" title="'+cat_title+'">'+cat_title+'</a>';dw+='</li>
'}dw+='</ul>
';dw+='<div id="navi-cat">
';if(cat_start>1){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start-cat_numb)+'\',\''+cat_class+'\');return false" title="'+cat_pre+'">'+cat_pre+'</a>'}if((cat_start+cat_numb-1)<tt){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start+cat_numb)+'\',\''+cat_class+'\');return false" title="'+cat_nex+'">'+cat_nex+'</a>'}dw+='<span>'+cat_start;if(cat_start!=tt){dw+=' &ndash; '+(cat_start+i-1)}dw+=' / '+tt+'</span>';dw+='</div>
';document.getElementById('show-post').innerHTML=dw+'<style type="text/css">.cat-'+cat_class+' a{background:#bbb!important;color:#fff!important}<\/style>'}function show_post(a,b,c){var d=document.getElementsByTagName('head')[0];e=document.createElement('script');e.type='text/javascript';e.setAttribute('src',cat_home+'/feeds/posts/default/-/'+a+'?alt=json-in-script&start-index='+b+'&max-results='+cat_numb+'&callback=show_post2');d.appendChild(e);cat_name=a;cat_start=parseInt(b),cat_class=c}function show_cat(a){var cat=a.feed.category;dw='';dw+='<ul>';for(var i=0;i<cat.length-1;i++){for(var j=i+1;j<cat.length;j++){if(cat[i].term>cat[j].term){cat_hv=cat[i].term;cat[i].term=cat[j].term;cat[j].term=cat_hv}}}for(var i=0;i<cat.length;i++){dw+='
<li class="cat-'+i+'">';dw+='<a href="" onclick="show_post(\''+cat[i].term+'\',\'1\',\''+i+'\');return false" title="';dw+=cat[i].term;dw+='">';dw+=cat[i].term;dw+='</a>';dw+='</li>
'}dw+='</ul>
';document.getElementById('show-cat').innerHTML=dw}document.write('<script type="text/javascript" src="'+cat_home+'/feeds/posts/default?alt=json-in-script&max-results=0&callback=show_cat"><\/script>');
</script>
</div>
<div style="clear: both;">
</div>
</div>
Ubah Url www.mochadnan.com dengan Url Blog Anda

Kode2
<script src="http://ceritangeblog.googlecode.com/files/Daftar%20isi.js.txt"></script> <script src="http://www.mochadnan.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

Klik ‘Pratinjau’ terlebih dulu, atau langsung klik ‘Publish’ untuk menayangkan halaman Daftar isi blog Anda. Cara ini berguna untuk kategori halamann statis, demikianlah cara membuat daftar isi atau sitemap blog di blogspot. Semoga bermanfaat. Wassalam…

→ About the author

Moch Adnan adalah Admin Blog yang mempunyai ketertarikan dengan Dunia Blogging,kamu bisa Menemukan saya dan memfollow saya di Google + Twitter Facebook


Terima Kasih Telah Membaca Artikel Cara Membuat Daftar Isi Atau Sitemap Blog Di Blogspot . Jika Anda tertarik dengan artikel seperti ini, silahkan untuk berlangganan artikel Gratis dengan cara mengetikkan alamat e-mail anda pada kotak berlangganan berikut:
Subscribe via Email

Silahkan tinggalkan komentarnya
Mohon untuk tidak memasukkan link hidup dalam berkomentar