The ONLY WAY to show formatted and syntax highlighted code in your wordpress post
11th of Nov, 2009
If you are reading this post, I can only hope you haven’t spent the last 4 hours trying to find a plugin to show code that actually works. Well, I have. It wasn’t a fun morning but at least I have found the one way to show code in a stable way. I tried about 10 syntax and formatting plugins but they all went haywire when i saved or switched between editor modes.
Stop talking and tell me what plugin to install!
Alright alright. You need 2 plugins:
- SyntaxHighlighter Plus
- Visual Code Editor
SyntaxHighlighter Plus
This is the plugin that actually renders your code into nicely colored / displayed text. You may already be using it but have found that it is really buggy.
Visual Code Editor
Despite its name, this plugin doesnt have anything to do with a visual interface. It visually does nothing, so don’t look around for a button, but it does stop your code and brackets from converting into a unicode mess.
An unbeatable Combo. But how to use them?
Visual code editor requires no user input, so just leave him to do his thing in the background. To use the Sytax Highlighter, follow these instructions:
- copy and paste this in to your post: [cf]insert1[/cf]
- you can change the code language. Full language support is listed here
- paste your code inside the tags
Demo
[sourcecode language="php"]
// I’m a comment!
function helloWorld()
{
echo ‘Hello World’;
}
?>
[/sourcecode]
Conclusion
Syntax highlighter plus has one problem, it doesn’t indent your code. I have read about a plugin called Syntax Highlighter and Code Colorizer for WordPress which does indent your code but I couldn’t get it to work stably in a post. If anyone finds out about a new update or syntax formatting plugin please comment and share your knowledge with everyone else.
