Earlier I showed you how we can integrate a simple HTML based tag cloud in Jekyll blog.
In this post, Let’s take a look at how we can integrate Wordpress Tag cloud plugin in Jekyll blog as shown in the right hand pane on this blog.
Wordpress Tag cloud plugin is a simple Flash based plugin which accepts a group of Url encoded Anchor Hyperlinks as the parameter to display as the tag cloud.
The flash file can be downloaded here.
To output this plugin we use a normal embed tag as shown below
Most of the parameters are self explanatory which you can customize based on your needs. The parameter to our interest is flashvars. In the above example, the decoded value of flashvars would be
flashvars is an array of parameters itself out of which the one of our most interest is tagcloud. This param again accepts a list of anchor hyperlinks which are Url encoded.
The example of the input is shown below
The value above needs to Url encoded and assigned to flashvars variable. In order to achieve this in Jekyll, we have two tasks
Generating list of tags dynamically
Dynamically resizing the text of each tag based on its cound
The first task can be simply achieved using standard Liquid Markup which is supported by Jekyll
To achieve the second task, we can augment our first code cleverly as shown below
Note that the above code will generate the list of anchor tags in loop and assign the appropriate Url, title and class attributes. You can modify these as per your convinience. This needs to be encoded before you put in use. You can use this site to do the encoding.
Our final Jekyll code looks like this
To make sure that the text is resized according to the number of posts, we add the following CSS in the CSS file