Planet CakePHP

The term category and tag are used interchangeably throughout this posting; they are assumed to be the same thing.

Having recently adopted Jekyll to power this website, I have been doing a bit of hacking/extending to get some added features in. A few days ago it was integrating Twitter with Jekyll, and now it's generating a tag cloud.

Back in July, Alex Young blogged about his Jekyll migration, and thoughtfully included a link to some code he wrote to list all posts broken out by category/tag.

I wanted to take this a bit further, and generate a per-category page which listed all the postings for that category, but also to generate a tag cloud.

Generating tag pages

After making a few changes to Alex's code, I ended up with a tag stub in a Rakefile which loops through all the categories used on the site and generates a static HTML page with a list of all the postings in that category.

Remember that this code snippet requires you to define your per-post categories in the YAML header of each post, e.g.

categories:
- jekyll
- blog
- ruby

(You need to mkdir tags in your Jekyll directory before executing the code below)

Now, the Rakefile segment:

desc 'Generate tags page'
task :tags do
puts "Generating tags..."
require 'rubygems'
require 'jekyll'
include Jekyll::Filters

options = Jekyll.configuration({})
site = Jekyll::Site.new(options)
site.read_posts('')
site.categories.sort.each do |category, posts|
html = ''
html << <<-HTML
---
layout: default
title: Postings tagged "#{category}"
---
Postings tagged "#{category}"

html << '

'
posts.each do |post|
post_data = post.to_liquid
html << <<-HTML

HTML
end
html << '

'

File.open("tags/#{category}.html", 'w+') do |file|
file.puts html
end
end
puts 'Done.'
end

There is also a gist here

Now you can run rake tags and it will generate a number of HTML files in the tags/ subdirectory; regenerating through Jekyll will then copy these files over to your site. Navigating to /tags/jekyll.html should list all your Jekyll related posts.

Generating your tag cloud

The below snippet does something similar, but just loops through each category and counts the number of tagged postings. It then does some very rudimentary font-size scaling to make the more popular tags
bigger.

puts 'Generating tag cloud...'
require 'rubygems'
require 'jekyll'
include Jekyll::Filters

options = Jekyll.configuration({})
site = Jekyll::Site.new(options)
site.read_posts('')

html =<<-HTML
---
layout: default
title: Tag cloud
---

Tag cloud

HTML

site.categories.sort.each do |category, posts|
html << <<-HTML
HTML

s = posts.count
font_size = 12 + (s*1.5);
html << "\"/tags/#{category}.html\" title=\"Postings tagged #{category}\" style=\"font-size: #{font_size}px; line-height:#{font_size}px\">#{category} "
end

File.open('tags.html', 'w+') do |file|
file.puts html
end

puts 'Done.'
end

There is also a gist here

This can be run with rake cloud - it would be worthwhile integrating these two commands into whatever post-publishing hooks you may use with Jekyll, so that they run automatically on new postings.

Note that if you have many more posts than I do (less than 30 at the moment), you will need to scale the font_size = 12 + (s*1.5) down a bit. Perhaps a function to calculate font size based on total number of posts would be sensible.

Now you should have a tag cloud where each tag links to a page containing all the relevant postings. I have also updated by post template to include a link to the tag pages.

Feel free to drop me a note (twitter?) with any queries or improvements, or post a comment below.