How to Display Nicely Formatted Code in Your WordPress Blog

8 Jun

Since I will be posting chunks of code in future blogs, I was looking for a way to format it easily in WordPress.  I always liked webpages with the neat little widgets on them that display code nicely formatted.    I found some WordPress code highlighting plug-ins and set out to install the one I liked the most.  Imagine my surprise when I tried to follow the instructions provided by author and found out that blogs from WordPress.com, like the one I am using, are not allowed to use plug-ins1.  This WordPress support page explains the differences between WordPress the hosted blog versus the downloadable, self-hosting solution.

I was a little disappointed because the <code> tag is horrible and a pain to use and I couldn’t imagine posting large blocks of code with that tag.  But as luck would have it, WordPress.com does offer a code highlighter for users of WordPress.com blogs.  I won’t go into the details as you can read more about it here.   I went back to one of my posts and used the tags in the page and viola! nicely formatted code!

Here is a trivial example:

<html>
   <body>
      <p>Nicely formatted code!</p>
   </body>
</html>

There is another article you may come across on codex.wordpress.org that talks about using the code tag, but trust me, you don’t want to use it! The codex article was the first search result that came up for me using Google and the following search terms: code wordpress blog. The article I link above was further down the results page, which is a shame since I think the lower rank article I linked above is what bloggers are looking for rather than the codex.wordpress.org article.

NOTE
1The VIP Program by WordPress.com allows for plug-ins…for $3,750/month!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: