Simple Sitemap for Blogger

2 min read
Simple Sitemap for blogger - Salam Labeltutorialblog, Hari ini saya akan berbagi widget sitemap yang cukup simple dan cukup menarik dan saat ini juga saya sedang menggunakan widget sitemap ini, sitemap itu berfungsi untuk memudahkan pengunjung blog sobat dalam mencari artikel dengan mudah dengan adanya sitemap tapi kebanyakan sitemap jika postingan anda sudah banyak lebih dari 1000 misalkan pasti cukup lama untuk load artikel pada sitemap, nah widget ini menurut saya cukup easy load untuk mengatasi masalah diatas.

simple sitemap for blogger

Simak Baik baik ya ulasan berikut ini :

Demo :




1. Login Blogger dan Buat halaman statis baru
2. Pindah ke tab HMTL bukan Compose
3. Copy Kode dibawah ini :

<style type='text/css'>
#show-cat{float:left;margin-right:20px;width:220px;height:391px;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='';cat_numb=10;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">'+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">'+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">'+cat_nex+'</a>'}dw+='<span>'+cat_start+' &ndash; '+(cat_start+i-1)+' / '+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;i++){dw+='<li class="cat-'+i+'">';dw+='<a href="" onclick="show_post(\''+cat[i].term+'\',\'1\',\''+i+'\');return false">';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>


4. Save dan Publish
5. Selesai deh nah bagaimana menurut sobat blogger dengan widget diatas ? sekian salam labeltutorial.

 source : http://blog.duypham.info/2013/01/sitemap-for-blogger.html

Anda mungkin menyukai postingan ini

  • cara membuat favicon sendiri di blog pakai photoshopSalam Pembaca Blog di label tutorial blog, Jika masih ada yang ingin membuat favicon di blog dan jika anda tertarik membuat favi…
  • cara membuat tombol search seperti googleSalam Para Labeltutorial.com - Pada Malam Yang sesunyi ini aku blogging tiada yang menemani hehe jadi nyanyi , oke langsung aja nih kali in…
  • Label Tutorial Blog - Tampilan Blogger yang telah diperbarui Mulai Bulan April 2012 Blogger akan membuat tampilan blogger yang di perbarui, sebenarnya tampilan blogger yang di perb…
  • cara membuat widget daftar tarif JNE di blogSalam para pembaca labeltutorial.com , maaf nih saya jarang update mengenai tentang blog , maklum saya lagi banyak kerjaan hehe , oke ka…
  • Label Tutorial Blog - Mengenal Tampilan Blogger Yang Di Perbarui. Seperti yang sudah saya tulisan artikel Bahwa mulai april 2012 tampilan semua blogger sudah diperbarui nah ol…
  • Cara Membuat Efek Loading Pada BLogSalam Labeltutorial.com - Hari ini labeltutorial blog akan membagikan tutorial tentang blog lagi nih , kali ini namanya Cara Membuat Efek Lo…

Posting Komentar