Cloudbacon Ramblings from someone named "braidn"

Syntax Highlighters in Nanoc

Code highlighting with say, Wordpress is an absolute breeze. All that is required is finding the plugin that suits your fancy. This isn’t quite as easy when using a solution like nanoc or any other Ruby based static site generator. This is due to the fact that all of your files are compiled on the fly into html, instead of being held in a database and being “served” every time someone visits your site (ala Wordpress/Drupal). For the person who is smart enough to run a static site, don’t fret. You have several great options that are dying for implementation.

The two that come to mind are Pygments and CodeRay. CodeRay is built with Ruby so it is as easy as:

However, since Pygments is Python specific, we need a little wrapper to make it work in our Ruby environment. A quick search on Github leads us to Albino…a wrapper for Pygments. Since it is a wrapper we need to nab Pygments by invoking:

and then:

For Cloudbacon, I have decided to stick with the Albino gem. The syntax is easier to write and much more svelte overall. In addition, another Github (I hang out there a lot) user has a wonderful set of css stylesheets that work flawlessly with Albino and Pygments. Simply include the gem in Nanoc’s Rules file, right before the routes, and add the css file (named ‘default.css’) into the output directory. Easy - code highlighting.

Some people might ask why I didn’t use the colorize_syntax filter offered by Nanoc itself? Well I did get it to work; however, you need to break down the css output and create your own stylesheet. I love writing Sass as much as the next person but, automation is just that much cooler. Get your Nanoc site under version control and try all three methods, see which one works best, and get your code out of block quotes. Since the above several lines are bash, and bash has no color, here is a simple ruby test:


Funny thing being, I now rely on gist code snippets to get the job done.