← Home

Mephisto Plugin: Tag Cloud


This plugin allows you to display a tag cloud in your Mephisto templates. It is, as of writing, the most complete, sophisticated, standard-conform (uses the rel-tag Microformat) and allover-awesome implementation of a tag cloud plugin for Mephisto. You guessed it, I'm biased ;)

The architecture of this plugin (i.e. the implementation as a custom Liquid tag) is based on the Boldr tag cloud plugin by Nicolas Mérouze.


To install the plugin you can do:

script/plugin install http://svn.artweb-design.de/stuff/mephisto/mephisto_tag_cloud

Thereafter you can use a dedicated liquid tag, 'tagcloud', in your templates like this:

<ul class="tagcloud">
|% tagcloud as tag %}
	<li>{{ tag | link_to_tag }}</li>
|% endtagcloud %}

We use CSS to define the formatting. Just define classes like these in your stylesheets:

.tagcloud .weight-1 { font-size: 10px; }
.tagcloud .weight-2 { font-size: 11px; }
.tagcloud .weight-3 { font-size: 12px; }
.tagcloud .weight-4 { font-size: 13px; }	


You can configure the number of sizes/weights that are generated through the option:

TagCloud.sizes = 6 # default: 10

This get's you a distribution over 6 sizes.

You can configure whether the tags are ordered alphabetically or by the weight of the tag by using:

TagCloud.order = :alpha  # default
TagCloud.order = :weight

You can specify the distribution method that is used to distribute the tags over the weights by using:

TagCloud.method = :log		# logarithmic distribution
TagCloud.method = :linear	# linear (weights share same range of counts)
TagCloud.method = lambda {|number| ... } 	# custom: specify your own

Tag cloud distribution graph

To visualize the distribution of your tags/weights and play around with the options, you can add this to your routes:

# config/routes.rb
map.connect 'tagcloud/distribution', 
            :controller => 'tag_cloud', 
            :action => 'distribution'

Afterwards you can access a simple distribution graph at /tagcloud/distribution. For an example of these graphs see here.

Further reading

You can read more about this plugin:


Very appreciated! Please email me.

blog comments powered by Disqus