1. Cauta tagul

   ]]></b:skin>

   si exact deasupra acestui tag adauga urmatoarele randuri

   /* 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} 

2. Dupa ce ai facut acest lucru, mai adauga exact dupa tagul ]]></b:skin> urmatorul script, care, de fapt, defineste cum va arata norul de etichete (label cloud-ul )

   <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>
   

3. Urmatorul pas poate fi efectuat doar daca ai deja lista de labeluri pus pe blog. Daca nu o ai, intra la sectiunea Layout si cauta dupa Add a Gadget. Executa click si in pop-upul care apare cauta dupa Labels.
   Adauga-l si salveaza templateul.
4. Acum du-te inapoi la sectiunea Edit HTML. Cauta dupa ‘label1′ (daca folosesti Firefox, apasa ctrl+f si introdu-l). Vei vedea un rand intreg care arata astfel:

   <b:widget id='Label1' locked='false' title='Labels' type='Label'/>

   Daca l-ai gasit inlocuieste-l cu cosul urmator (nu te mira cat de lung e, doar inlocuieste-l):

<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>

Acum o sa explic in ce mod putem schimba dimensiunile si culorile literelor (si alte tweakuri). Cele mai multe modificari se pot efectua la scriptul care a fost adaugat dupa tagul ]]></b:skin>. Sa le luam pe rand.

var cloudMin= 1 – aici putem seta cate label-uri vor fi afisate. Daca lasi 1, vor fi afisate toate etichetele, iar daca introduci un numar mai mare, va fi afist un numar de etichete egal cu cat ai scris in loc de 1.

var maxFontSize = 20 – marimea maxima a caracterelor din label cloud (dat in pixeli)

var maxColor = [0,0,255]b – culoarea caracterelor cele mai mari (format RGB; mai jos este o lista de culori pentru web)

var minFontSize = 10 – marimea minima a caracterelor din label cloud (dat in pixeli)

var minColor = [0,0,0] – culoarea caracterelor cele mai mici din label cloud (acealasi lucru ca la maxColor)

var lcShowCount = false – aici poti afisa sau ascunde numarul posturilor care sunt etichetate cu o anumita eticheta. acest lucru este important doar atunci cand vrei sa afisezi o lista si nu un ‘nor’.

Cei mai multi se opresc la editarea valorilor de mai sus, dar daca tu esti mai pretentios nimeni nu iti cere asta. Daca vrei sa schimbi fontul sau alinierea in label cloud fa urmatoarele: In partea care am adaugat-o deasupra tagului ]]></b:skin> vei gasi

#labelCloud {text-align:center;font-family:arial,sans-serif;}

text-align:center – in loc de center poti scrie justify, right sau left, dupa preferintele tale.

font-family:arial,sans-serif – aici poti schimba fontul.

Randul urmator #labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;} Aici nu prea multe avem de modificat, doar daca suntem un nebun de CSS.

display:inline – daca e setat pe inline va arata ca un label cloud normal, dar daca inlocuim inline cu block atunci va arata ca o lista, care va putea fi setat in ordine alfabetica sau in ordinea frecventei etichetelor de la proprietatile gadgetului (daca esti logat atunci, cand intri pe blogul tau, langa fiecare gadget apare un ciocan si o surubelnita puse una peste alta).

Cam atat. Daca nu va reuseste spuneti-mi.

Inspirat de Phydeaux3.

1. Intra in contul tau blogger la sectiunea layout, iar de acolo alege Edit HTML
2. Cauta tagul

   ]]></b:skin>

   si imediat dupa aceasta introdu urmatorul rand:

   <script src="http://site.gman.googlepages.com/Emoticon.js" type="text/javascript"/>

3. Dupa aceea cauta tagul

   <body>

   si inlocuieste-l cu tagul

   <body id='emoticon' onload='replaceText();'>

De fapt, ca sa inteleaga toata lumea, pasii de mai sus nu fac altceva decat sa inlocuiasca textul cu emoticonuri. Adica, daca tu ve scrie : – ) (fara spatii) va iesi . Astfel poti folosi toate emoticonurile din yahoo messenger (chiar si cele ascunse ) ).