Many Files For You

Oct 6, 2010

Cara Membuat Tag Clouds

Tags Clouds adalah sebuah Label yang hurufnya tidak rata, dinamakan Tags Clouds karena bentuknya menyerupai awan yang berbeda ukuran hurufnya. Tag Clouds ini sangat unik karena jika semakin besar hurufnya maka menandakan kepopuleran dari Tags/Label tersebut.

Nah apabila Anda belum tau mengenai Tags Clouds Saya akan memberikan contohnya seperti dibawah ini:

Contoh diatas adalah tampilan Label Tags Clouds... Semakin besar hurufnya maka semakin populer categorinya

Apakah anda tertarik untuk membuatnya? Kalau tertarik nihh aku kasih tahu caranya

1.Log in Ke Blogger Lalu masuk Menu Layout kemudian klik Edit HTML
2.Lalu letakan Code dibawah ini, tepat diatas Code ]]></b:skin>

3.Lalu letakkan Code Dibawah, tepat dibawah Code <head>

4. Setelah langkah diatas selesai, Scroll Kebawah dan lalu cari Code
<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&gt;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 = &quot;<data:label.name/>&quot;; 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] &lt; cloudMin){ continue; } for (var i=0;3 &gt; 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, kemudian Save Template