How to display code in your WordPress blog posts like Smashing Magazine

I encountered this problem while doing a post on how to add a Facebook like button to your WordPress blog. Everytime I entered code into a blog post, WP would strip it out and there would be nothing to see in the post. Since the whole post was about a couple of lines of code, this was clearly not a good thing…

I was trying to get the cool code wrappers that Smashing Magazine uses, and I finally found a plugin that allows to me to do just that. The plugin is called Google Syntax Highlighter For WordPress and you can find it here: http://wordpress.org/extend/plugins/google-syntax-highlighter/

Once you install the plugin, all you need to do is preface the code you want to display in your post with a pre tag and define the correct class. You can see all the different class aliases for different languages here: http://code.google.com/p/syntaxhighlighter/wiki/Usage

The end result looks something like this:

How To Add A Like Button to your wordpress blog

(view this post)