Tuesday, 27 January 2009

Tag Clouds for Blogger

I found this useful tag cloud for blogger.

Simple Tag Cloud Widget for Blogger

I've replicated the code below just in case the above link does not work. All you need to do is add a label widget and change its code to the following:

   1: <b:widget id='TagCloud' locked='false' title='Tags' type='Label'>
   2:     <b:includable id='main'>
   3:     <b:if cond='data:title'>
   4:       <h2><data:title/></h2>
   5:     </b:if>
   6:     <div class='widget-content' style='text-align: justify;'>
   7:          <script type="text/javascript">
   8:         /*
   9:         Simple Blogger Tag Cloud Widget
  10:         by Raymond May Jr.
  11:         http://www.compender.com
  12:         Released to the Public Domain
  13:         */
  14:         //Variables:
  15:         var max = 150; //max css size (in percent)
  16:         var min = 50; //min css size (...)
  17:         var showCount = 1;  // show counts? 1 for yes
  18:         var minCount = 1;  // what is the minimum count for a Tag to be shown? 1 for all.
  19:         
  20:         //Begin code:
  21:         var range = max - min;
  22:  
  23:         //Build label Array
  24:         var labels = new Array();
  25:          <b:loop values='data:labels' var='label'>
  26:            labels.push("<data:label.name/>");
  27:          </b:loop>
  28:  
  29:         //URLs
  30:         var urls = new Array();
  31:          <b:loop values='data:labels' var='label'>
  32:            urls.push("<data:label.url/>");
  33:          </b:loop>
  34:         
  35:         //Counts
  36:         var counts = new Array();
  37:          <b:loop values='data:labels' var='label'>
  38:            counts.push("<data:label.count/>");
  39:          </b:loop>
  40:         
  41:         //Number sort funtion (high to low)
  42:         function sortNumber(a, b)
  43:         {
  44:          return b - a;
  45:         }
  46:         
  47:         //Make an independant copy of counts for sorting
  48:         var sorted = counts.slice();
  49:         
  50:         //Find the largest tag count
  51:         var most = sorted.sort(sortNumber)[0];
  52:         
  53:         //Begin HTML output
  54:         for (x in labels)
  55:         {
  56:              if(x != "peek" && x != "forEach" && counts[x] >= minCount)
  57:              {
  58:                   //Calculate textSize
  59:                   var textSize = min + Math.floor((counts[x]/most) * range);
  60:                   //Show counts?
  61:                   if(showCount == 1)
  62:                   {
  63:                        var count = "(" + counts[x] + ")";
  64:                   }else{
  65:                        var count = "";
  66:                   }
  67:                   //Output
  68:                   document.write("<span style='font-size:" + textSize + "%'><a href='" + urls[x] + "'>" + labels[x] + count + "</a></span> " );
  69:              }
  70:             }
  71:             </script>
  72:         </div>
  73:     </b:includable>
  74: </b:widget>

1 comment:

Adam Hicks said...

Note to self!! Do not use quotes in the labels as it screws up the code.