Skip to content

Playing with Syntax Highlighters

Update: I no longer (2012-08-05) use Chili, I've switched to Prism.

I wanted to try different syntax highlighters so I wrote a little WordPress plugin that let me switch between different highlighters (email me if you would like that code). I wanted syntax highlighters that were javascript-based (ruling out GeSHi), and that allowed me to highlight inline code elements as well as code elements within block-level pre elements, using the HTML5 <code class="language-whatever"> notation for determining language. I also wanted something that didn't do any fancy javascript or Flash for selection and copying, and either supported Lisp and Basic or was easy enough to extend.

Everyone seems to use Alex Gorbatchev's syntaxhighlighter but it uses nonstandard name attributes and only works on pre and textarea elements, so I haven't tried that. I tried Benjamin Lupton's jQuery syntaxhighlighter based on Google's prettify. It insisted on making all elements display: block but a little CSS manipulation fixed that.

Then I tried snippet, which only works on pre elements but was easily modifiable to get around that, then also needed some stylesheet changes to keep the results from being display: block. Adding new languages however looks far too complicated; it uses shjs which uses language definitions from GNU Source-highlight, which is a whole different language.

jush does things right (working on code elements and not forcing them to be block) but it's hardwired for a limited number of languages and the CSS is pretty ugly. That could be fixed, though, and it does a cool trick of turning keywords into links to the documentation. Too limited a language selection, though, but it would be a nice base for working on.

In the end, I'm going to stick with chili. It's simple enough for me to modify to suit my needs, it's easy to add new languages and it works. Creating new "themes" is impossible; the styles are hard-coded into the javascript files, but I can live with that. I may sometime write my own highlighter, but for now, I'll stick with what works.

Post a Comment

Your email is never published nor shared. Required fields are marked *