Cara simple/singkat membuat tag cloud pada bloggerPertama saya mengenal blog,banyak sekali istilah-istilah widget blogger yang ingin saya ketahui. Seperti halnya ‘Tag Cloud’yang akan kita bahas kali ini. Dulu,saya mengerti dan pernah menjumpai widget seperti ini,namun karena tidak mengerti apa namanya,maka saya googling dengan berbagai kata kunci. Seperti;'cara membuat tulisan besar dan kecil pada blogger',atau 'cara membuat widget tulisan tebal dan tipis',dll. Bahkan saya sempat bertanya langsung pada masternya,sampai saya tahu itu namanya Tag Cloud. Beberapa waktu lalu saya sempat memposting juga tentang cara membuat tag clouds untuk blogspot,namun masih manual bukan wyswyg seperti fitur blogger saat ini. Karena,seiring berkembangnya fitur instant blogger,blogger sudah memberikan langkah mudah untuk membuat label berbentuk awan ini. Nah,untuk contoh tag cloud,anda bisa lihat ilustrasi gambar di atas,atau bisa kunjungi langsung blog teman saya di mendengarkan musik mp3 gratis. Langkah Sederhana Membuat Tag Cloud Untuk BloggerSeperti biasa,untuk membuat tag cloud ini,pertama pergilah ke Tata Letak,lalu add new widget atau klik tulisan Tambah Gadget untuk blog berbahasa indonesia. Setelah itu muncul dialog box,pilih Label. Kemudian akan muncul jendela baru lagi,lalu pada option pilihlah Tag Cloud,lalu klik tulisan Simpan. Selesai,anda sudah berhasil membuat tag cloud di blogger,dan silakan lihat hasilnya. Semoga bermanfaat ya :D Baca Juga Yang Ini.. |
Showing posts with label Awan Cloud. Show all posts
Showing posts with label Awan Cloud. Show all posts
Wednesday 2 December 2009
Membuat Tag Cloud Di Blogger
Monday 19 January 2009
Membuat Tag Clouds
Tag Clouds ...Untuk membuat tag clouds,anda harus sudah membuat label pada situs anda. Pilih bagian Dashboard ke Pengaturan lalu pada Page Element tambah halaman baru add widget, pilih Label. Setelah itu Edit HTML kemudian beri tanda centang pada Expand Widget Templates. Cari kode :
Klo dah ketemu,lalu copy paste kode di bawah ini diatasnya : /* Label Cloud Styles Setelah itu,tepat di bawah kode : ]]></b:skin> copy paste kode di bawah ini : <script type='text/javascript'> Lalu simpan template. Langkah terakhir,masih pada Edit HTML cari kode di bawah ini : <b:widget id='Label1' locked='false' title='cloud' type='Label'>< b:includable id='main'> <b:if cond='data:title'> <h2></h2> </b:if> <div class='widget-content'> <ul> <b:loop values='data:labels' var='label'> <li> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'> <data:label.name/> </span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'> <data:label.name/> </a> </b:if> <span dir='ltr'>(<data:label.count/>)</span> </li> </b:loop> </ul><b:include name='quickedit'/> </div> </b:includable> </b:widget> Kalau dah ketemu,ganti kode diatas dengan kode di bawah ini : Alangkah baiknya backup terlebih dahulu template ke komputer anda, Akurat koq :) <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> Simpan Template! Selesai !Baca Juga Yang Ini.. |
Subscribe to:
Posts (Atom)