Robert Eisele
Engineer, Systems Architect and DBA

Tag Cloud plugin for Smarty

I've written a featureful plugin for the Smarty templating engine to be able to generate tag clouds very easily. Smarty by itself is a really slow engine, so that it would not the worst idea to use a plugin which is written in pure PHP instead of generating the list of words with the even slower {math} extension of Smarty.

To use the plugin, you need to place the PHP file into your smarty plugins directory. In your PHP script, do something like this:


$tags = array(
  array('tag' => 'Robert', 'num' => 55, 'link' => 'robert'),
  array('tag' => 'xarg', 'num' => 66, 'link' => 'xarg'),
  array('tag' => 'Open Source', 'num' => 41, 'link' => 'open-source'),
  array('tag' => 'PHP', 'num' => 90, 'link' => 'php'),
  array('tag' => 'Smarty', 'num' => 14, 'link' => 'smarty'),

$smarty->assign_by_ref('tags', $tags);


In the template you're display()ing or fetch()ing, you can now use the new {cloud} tag, like so:

{cloud tags=$tags minsize=6 maxsize=25 sort="random" limit=50 url="/tag/%link%/" class="tags tag-%size%" font="%size%px"}

The example of above could generate an output similar to this:

The new function is able to handle the following parameters:

  • tags - The array containing all tags in a new sub array with the following elements:
    • tag - The label of the tag
    • num - The total sum or weight of the tag
    • link - The link token or the ID of the tag which is tight fitted into the link via %link%
  • minsize (optional) - The minimum size used for class counting or font sizes (default: 8)
  • maxsize (optional) - The maximum size used for class counting or font sizes (default: 30)
  • url (optional) - The URL mask used to generate the final link via %link%
  • sort - The sequence in which the tags should be shown. Can be one of the following values:
    • random - Sort randomly
    • alphabetic - Sort in alphabetic order
    • alphabetic-desc - Sort in descending alphabetic order
    • weight - Sort by the weight of a tag
    • weihgt-desc - Sort by the weihgt of a tag in descending order
  • limit (optional)- The maximum count of tags to be shown (default: all)
  • class (optional) - If you want to use the calculated size as part of a class name via %size%
  • font (optional) - If you want to use the calculated size as part of the font size parameter via %size%
  • format (optional) - If you need a maximum of flexibility to override url, class and font and write an own link line like:
<a href="/tag/%link%/" class="tags tag-%size%">%tag%</a>

The size of the %size% parameter is ever an integer in the interval [minsize, maxsize]. This way it's possible to is it as class-name extension as well as a font-size CSS property. Note, that for class names, the lowest number is also the smallest tag.

You might also be interested in the following


Sorry, comments are closed for this article. Contact me if you want to leave a note.