Turn Your Code into Pretty, Syntax-Highlighted HTML

Monkey Pygment is a web application that allows you to paste in code from a variety of programming languages and produces syntax highlighting (prettified) code as HTML markup, suitable for copying and pasting into the HTML code of your website or blog.

Here are step by step instruction for adding syntax highlighted, prettified code to your blogger blog. The first time I wanted to paste code into my blogger site I went searching for a nice way to do syntax highlighting. I knew about Pygments already and had used it to transform whole files, but it seemed a little awkward to use the pygmentize command line tool for each snippet in a blog post. What I wanted was a quick way to transform a block of code into a snippet of HTML for pasting into my blog post directly. Working toward a more convenient workflow I decided I would make a simple web application to expose the basic functionality of Pygments as applicable to publishing on the web.

To use Monkey Pygment or other pygments output in your site, you’ll need to install the pygments CSS file code (see the instructions). You can install this in a code block in the head of your HTML document or save it as a file somewhere and link to it from many web pages.

I’ve seen some sketchy advice on getting your CSS code into your blogger blog. I guess the feature to cleanly add CSS to your blogger site is relatively new. If you don’t know, here’s how to use the template designer to add CSS to your blogger blog.

Monkey Pygment will currently do syntax highlighting for Python, Perl, Ruby, HTML, Javascript, CSS, Java, XML, YAML, C#, C and C++. This is a tiny subset of what Pygments can do, but I wanted to keep the web application manageable.

I did some searching to see if someone had already provided similar functionality. I found a nice tool written in Javascript that will highlight your code on the client side. It looks a little annoying to set up, but provides nice results. I prefer the webapp method, because the rending only has to happen once this way.  I apparently completely missed the fact that there were two other web applications that provided this functionality.  One is more focused on providing a REST API.  Another provides a form for cutting and pasting code just as Monkey Pygment does. The list of who uses pygments also refers to a www.pygments.com link that somehow uses both pygments and javascript but is broken.  Google also has its own Javascript tool for making pretty code.

If I knew about the two other appengine hosted apps that have already been created, I probably wouldn't have bothered, or would have based my work on that already existing.  Monkey Pygment is nevertheless different in aiming for simplicity.  Monkey Pygment exposes less Pygments functionality, but it should be a little easier to understand and require fewer key strokes.

comments powered by Disqus