By the way, this applies not only to code, but also anything that you might want to display to the user as-is, without line breaks, maybe even a poem.

Why a Code Syntax Plugin

Anyway, if you enter program code in the normal WordPress visual editor, you’ll lose the indentation:

public static void main(String[] args) throws ClientProtocolException, IOException {

URL url = new URL(“https://ssl.site”);
Socket s = new Socket(“proxy.address”, 8080);

Also, lines will usually wrap, which, depending on the programming language, may or may not change the meaning of the code, but might also hinder the reader’s understanding of it.

As well, since the text will be in a proportional font instead of monospace, which is usually used to line up text columns with code.

Code Syntax Plugins for WordPress

Code Snippet

The top Google result for “wordpress code plugin” is Code Snippet. It’s based on the excellent and flexible GeSHi syntax highlighting engine. Unfortunately, the last time it was updated was 2007, and the total all-time downloads (about 3000) are equal to the weekly downloads for wp-syntax, discussed below.

Google Code Highlighter

The Google Syntax Highlighter for WordPress also highlights code. It uses the Google Syntax Highlighter. Disadvantages of this plugin as I see it include:

• JavaScript is required. The code isn’t highlighted as-is, rather it’s highlighted when it reaches the user’s browser. I’m not quite sure how this is to work in FeedBurner and other readers.
• Much fewer languages are supported than GeSHi. While the supported languages are the most common ones in use today, it hardly seems worthwhile to limit your blogging to just these specific languages.

Google Syntax Highlighter WordPress Plugin: Sample 1

wp-syntax

wp-syntax is the best overall plugin for displaying code in WordPress:

wp-syntax WordPress Plugin: PHP Sample 1

• It’s based on GeSHi, which supports over a hundred programming languages.
• All the highlighting happens on the server, and the syntax coloring is embedded in the HTML instead of being in a separate stylesheet file. What that means is that users reading your webfeed in something like FeedBurner will see highlighted code.
• The high number of downloads reduce the possibility that you’ll have standardized on a plugin that will be abandoned.
• The code display is very sleek, unlike a lot of other highlighting plugins. For example, the Google Highlighter has “view plain”, “copy to clipboard”, “print”, and “?” menu items. This is partly necessitated by the fact that many code plugins have so much cruft that a normal select-and-copy operation doesn’t result in copying usably indented code to the clipboard. I’m put off by the fact that a code display needs a user interface! wp-syntax just works; you select the code, copy, and  paste.
• You can choose whether to display line numbers or not, adding to the unburdened display.

Using wp-syntax

Just put your code in a <pre> block. You can do that by selecting the “Preformatted” option in the text Format selector. If that’s not visible, you may need to press the “Show/Hide Kitchen Sink” button, which is the rightmost button on the top row in the Visual Editor.

After you’re done adding your all your code blocks, switch to the HTML Editor, and add a lang=”java” (or whatever language you’re using) to the <pre> blocks.  You can also add a line=”1″ to start line number at whatever number you want. (But beware, this’ll be stripped away after switching back to the Visual Editor.)

<pre lang="java">

That's it for basic usage.

Note: be sure to watch for more posts, which will go into more detail about installing and using the wp-syntax plugin.

Get wp-syntax here.

Related posts:

1. Making Minor Changes in WordPress Without Updating the Last-Updated Date with the Minor Edit Plugin
2. Installing the cbnet Ping Optimizer Plugin for WordPress
3. How to Stop Spam in WordPress with the Akismet Plugin