Syntax-highlighted Markdown Blocks using Prettify in Wordpress
Nick and I have been playing with WordPress on the test site lately. I wanted to implement a Stack Overflow style Markdown input with syntax highlighting. This can be quickly accomplished by activating MarkItUp!, PHP Markdown, Prettify for WordPress, and (optionally) ThemeKit.
With this, you can create code blocks in the standard Markdown way: indenting with four spaces:
This is [Markdown](http://michelf.com/projects/php-markdown/). // And this is code int i = 0; End of `code` region.
This works well, but doesn't add syntax highlighting to code blocks. Instead, you have to enter HTML code into your Markdown, manually specifying
class="prettyprint". In my mind, this defeats the elegance and simplicity of Markdown.
This is [Markdown](http://michelf.com/projects/php-markdown/). <pre class="prettyprint"> <code> // And this is code int i = 0; </code> </pre> End of `code` region.
Ick. Fortunately, the fix is very simple: edit
wp-content/plugins/markdown.php to automatically add the "prettyprint" CSS class to preformatted code blocks. If you're in a hurry, download my edited copy. Otherwise, open the file a text editor and find line 1105:
$codeblock = "<pre><code>$codeblock\n</code></pre>";
Add class="prettyprint" to it:
$codeblock = "<pre class=\"prettyprint\"><code>$codeblock\n</code></pre>";
Save it and reload your pages. All code blocks should now automatically have syntax highlighting.