Code Highlighting in Wordpress using Vim & Yankcode

Update 1/1/2012: this blog no longer uses wordpress.

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](http://www.yasker.org/en/blog/a-vim-script-for-pasting-syntax-code-to- webpage-33)) 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!:

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