Nahhh pada kali ini saya yang bernama Anas akan menulis artikel yang biasanya digunakan di wordpress dan technorati yaitu Tag Clouds.. jika anda belum mengerti tentang Tag Clouds saya akan menerangkan sedikit pengertianya..
Tags Clouds adalah sebuah Label yang hurufnya tidak rata maka dari itu dinamakn Tags Clouds yang artinya Tag adalah Label dan Clouds adalah awan jadi rengkumanya adalah Label yang seperti awan atau tidak rata.. Nah jika Tags yang hurufnya berbentuk rata biasanya itu adalah tags yang populer di blog anda jika kecil itu kurang populer... jadi pengertianya adalah semakin besar hurufnya maka menandakan kepopuleran dari Tags tersebut... makanya anda membuat tags dengan kata-kata yang sering digunakan dan tepat dengan isi tagsnya tul gakk
Nah jika Anda belum tau Tags Clouds Saya akan memberikan contohnya niii dibawahhh
komputer, Blogging, Bisnis Online
laptop, Widget Blog, Yahoo, Google,
blogeer, wordpress, SEO
trik-tips Blog
Pernak-pernik Blog,
other
Nah contoh diatas adalah tampilan Label yang telah dimodifikasi menjadi Tags Clouds... Semakin besar hurufnya maka semakin populer categorinya
Gimanna anda pengen buat gakk kalau pengen nihh dibawah aku ajari caranya..
1. Log in Ke Blogger Lalu masuk Menu Layout kemudian Edit HTML
2. Kemudian Taruh Code dibawah diatas Code ]]></b:skin>
/* Label Cloud Styles
----------------------------------------------- */
#labelCloud {text-align:center;font-family:arial,sans-serif;}
#labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}
#labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}
#labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0}
#labelCloud a{text-decoration:none}
#labelCloud a:hover{text-decoration:underline}
#labelCloud li a{}
#labelCloud .label-cloud {}
#labelCloud .label-count {padding-left:0.2em;font-size:9px;color:#000}
#labelCloud .label-cloud li:before{content:"" !important}
3. Lalu juga taruh Code Dibawah tepat dibawah Code <head>
<script type='text/javascript'>
// Label Cloud User Variables
var cloudMin = 1;
var maxFontSize = 20;
var maxColor = [0,0,255];
var minFontSize = 10;
var minColor = [0,0,0];
var lcShowCount = false;
</script>
4. Lalu Scroll Kebawah coba cari Code seperti ini <b:widget id='Label1' locked='false' title='Labels' type='Label'/>
5. Lalu Ganti code diatas dengan Code dibawah Ini
<b:widget id='Label1' locked='false' title='Label Cloud' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='labelCloud'/>
<script type='text/javascript'>
// Don't change anything past this point -----------------
// Cloud function s() ripped from del.icio.us
function s(a,b,i,x){
if(a>b){
var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)
}
else{
var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)
}
return v
}
var c=[];
var labelCount = new Array();
var ts = new Object;
<b:loop values='data:labels' var='label'>
var theName = "<data:label.name/>";
ts[theName] = <data:label.count/>;
</b:loop>
for (t in ts){
if (!labelCount[ts[t]]){
labelCount[ts[t]] = new Array(ts[t])
}
}
var ta=cloudMin-1;
tz = labelCount.length - cloudMin;
lc2 = document.getElementById('labelCloud');
ul = document.createElement('ul');
ul.className = 'label-cloud';
for(var t in ts){
if(ts[t] < cloudMin){
continue;
}
for (var i=0;3 > i;i++) {
c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)
}
var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);
li = document.createElement('li');
li.style.fontSize = fs+'px';
li.style.lineHeight = '1';
a = document.createElement('a');
a.title = ts[t]+' Posts in '+t;
a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';
a.href = '/search/label/'+encodeURIComponent(t);
if (lcShowCount){
span = document.createElement('span');
span.innerHTML = '('+ts[t]+') ';
span.className = 'label-count';
a.appendChild(document.createTextNode(t));
li.appendChild(a);
li.appendChild(span);
}
else {
a.appendChild(document.createTextNode(t));
li.appendChild(a);
}
ul.appendChild(li);
abnk = document.createTextNode(' ');
ul.appendChild(abnk);
}
lc2.appendChild(ul);
</script>
<noscript>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
</noscript>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
6. Selesai Deh kemudian Save
Jika kamu Faham tentang CSS kamu bisa mengotak-atik tampilanya sendiri...
Nahh gimana gampang thoo dengan Tags Clouds kan kita bisa mengetahui Tags mana yang paling populer iya kannn..... kalau begitu sekian dulu yahhh Anas udah gak tahan lagi nih mau belajar hal-hal yang belum aku mengertii.... Jangan lupa isi komentar yahhh.... biar aku bisa membenahi artikel ini jika ada kesalahan .... thanks
