Code Highlighting in Wordpress using Vim & Yankcode

3/04/2009

After looking through a bunch of wordpress plugins that weren’t doing it for me, this is the scheme I came up with to get code syntax highlighting working for my blog. You can easily paste code into wordpress which should closely resemble the way it is highlighted in Vim:

First download the Yankcode vim plugin, written by Sheng Yang and (per the instructions on his blog) open up a big source file that contains all the different syntax elements you will want to style (e.g. comments, operators, etc.). Then use vim’s builtin TOhtml function to output an html file that we will extract our style sheet from. In Vim:

:let html_use_css=1
:TOhtml
:w keepOnlyTheCss.html

Follow the instructions from the linked blog on how to extract the CSS. You can remove the background-color elements and change anything that you like. Add the CSS rules to the end of your ’style.css’ file in your theme’s directory. Now you can insert code into your blog by highlighting the code in Vim, entering ‘:Yankcode‘ and pasting it into Wordpress with ctrl-v.

One more thing: wordpress will mangle your double quotes and -- so I installed the Raw HTML plugin for Wordpress and modified the Yankcode vim plugin so that it wraps the blockquotes in Raw HTML’s special comments, which disable wordpress’s special formatting.

And here is an example!:

607 ---maybe export:
608 cond :: a -> a -> Bool -> a
609 cond x y b = if b then x else y

No Comments

“Hello world!” :: String

24/03/2009

This will be a blog about programming, mostly in the functional programming language Haskell. I’m starting it to publish my projects and experiments that I think others might find interesting. My goal is to express ideas clearly, and in a way that takes as little of my reader’s time as possible. I hope that I learn a lot from my readers in the process!

I am running a wordpress blog, using the fine Vostok theme created by Javier Cañada and Rubén Lozano, which can be downloaded here. Those guys also have a nice blog.

1 Comment