IDE, Programming, Various Languages, Web Development

WordPress Source Code Support Options


Up until today I thought that the only way to show source code in a blog site was to use the <pre></pre> OR <tt></tt> OR <code></code> tags.

In the past I’ve found that these tags are alright for showing small code snippets, but they do nothing to enhance the readability of larger or more involved blocks of code. Often I’ve found code samples that I’ve posted using these tags is more confusing than helpful.

Imagine, then, my surprise when I stumbled onto this WordPress help article titled: Code » Posting Source Code. Apparently there has been a third option all along that I have been unaware of.

This is great news for anyone wanting to share legible source code. Rather than using the clunky <pre> and <code> tags you can use:

[  code language="Enter_Language_Here"  ]

[  /code  ]

The great part is that you can enter the language you are working with as a parameter, and WordPress will format your posted code for legibility into what the code would look like in your development environment.

I tested this with some SQL Source code that I had posted several days earlier and the improvement was nothing short of spectacular.

Where before I had used color formatting within the <pre> tag, when I encapsulated my code sample with 

[ code language="sql" ][ /code ]

suddenly the code became nicely formatted and made a lot more sense. It more or less looked exactly like it would in SQL Server Management Studio (SSMS), which is a huge jump in clarity.

The original WordPress help article has a full list of the supported languages. Personally, though, I will find the following to be the most useful options:

  • csharp
  • css
  • html
  • javascript
  • powershell
  • sql
  • vb
  • xml

In addition to specifying the source language, you can set a number of options. For example, you can set autolinks=”false” which will stop the habit of WordPress from automatically turning any http that you have into an active hyperlink.

Another nice option is that you can highlight specific lines of your code using a comma-separated list of line numbers (ie: highlight=”5,10,11″ )

All of this is great stuff that I hadn’t been aware of before. I’m glad that the WordPress creators are also keeping us developers in mind when they are considering what features to add to WordPress.


Leave a Reply

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

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

Facebook photo

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

Connecting to %s