Tips: Posting source code in WordPress blogs

I haven’t been too happy with the WordPress blog editor as it doesn’t let me to post source code snippets in my blogs – especially Javascript and XML. Although it allows Java, bash scripts and other code bits to be embedded within the <code> </code> tags, the final display isn’t too visually appealing as you can see below – probably to do with the the default CSS settings.


abhi@hbase2:~$ ls -lthR /opt/hbase/data/
/opt/hbase/data/:
total 16K
drwxrwxr-x 4 hbase hbase 4.0K Oct 30 12:47 users
drwxrwxr-x 4 hbase hbase 4.0K Oct 30 12:00 -ROOT-
-rwxr-xr-x 1 hbase hbase 38 Oct 30 12:00 hbase.id
-rwxr-xr-x 1 hbase hbase 3 Oct 30 12:00 hbase.version

/opt/hbase/data/users:
total 4.0K
drwxrwxr-x 4 hbase hbase 4.0K Oct 30 12:47 a070247328d9deec48d4e3cfa46b33a4

/opt/hbase/data/users/a070247328d9deec48d4e3cfa46b33a4:
total 4.0K
drwxrwxr-x 2 hbase hbase 4.0K Oct 30 12:47 info

/opt/hbase/data/users/a070247328d9deec48d4e3cfa46b33a4/info:
total 0

/opt/hbase/data/-ROOT-:
total 4.0K
drwxrwxr-x 4 hbase hbase 4.0K Oct 30 12:12 70236052

/opt/hbase/data/-ROOT-/70236052:
total 4.0K
drwxrwxr-x 2 hbase hbase 4.0K Oct 30 12:11 info

/opt/hbase/data/-ROOT-/70236052/info:
total 8.0K
-rwxrwxrwx 1 hbase hbase 718 Oct 30 12:11 a913edee0ac34de490c46ee12175dc02
-rwxrwxrwx 1 hbase hbase 714 Oct 30 12:00 c6f09dc3ee6a4150b8e787a747a81707
abhi@hbase2:~$

Luckily I chanced upon the following link http://en.support.wordpress.com/code/posting-source-code/ and it shares some neat tips that one can use.

The [sourcecode] [/sourcecode] tags definitely give a much better look as evident below.

abhi@hbase2:~$ ls -lthR /opt/hbase/data/
/opt/hbase/data/:
total 16K
drwxrwxr-x 4 hbase hbase 4.0K Oct 30 12:47 users
drwxrwxr-x 4 hbase hbase 4.0K Oct 30 12:00 -ROOT-
-rwxr-xr-x 1 hbase hbase   38 Oct 30 12:00 hbase.id
-rwxr-xr-x 1 hbase hbase    3 Oct 30 12:00 hbase.version

/opt/hbase/data/users:
total 4.0K
drwxrwxr-x 4 hbase hbase 4.0K Oct 30 12:47 a070247328d9deec48d4e3cfa46b33a4

/opt/hbase/data/users/a070247328d9deec48d4e3cfa46b33a4:
total 4.0K
drwxrwxr-x 2 hbase hbase 4.0K Oct 30 12:47 info

/opt/hbase/data/users/a070247328d9deec48d4e3cfa46b33a4/info:
total 0

/opt/hbase/data/-ROOT-:
total 4.0K
drwxrwxr-x 4 hbase hbase 4.0K Oct 30 12:12 70236052

/opt/hbase/data/-ROOT-/70236052:
total 4.0K
drwxrwxr-x 2 hbase hbase 4.0K Oct 30 12:11 info

/opt/hbase/data/-ROOT-/70236052/info:
total 8.0K
-rwxrwxrwx 1 hbase hbase 718 Oct 30 12:11 a913edee0ac34de490c46ee12175dc02
-rwxrwxrwx 1 hbase hbase 714 Oct 30 12:00 c6f09dc3ee6a4150b8e787a747a81707
abhi@hbase2:~$

I intend to replace all my <code> </code> tags in past entries with [sourcecode] [/sourcecode] the moment I get some free time. I wonder if there’s a simpler way to do this. Please do drop in a line if you think so :).

One thought on “Tips: Posting source code in WordPress blogs

  1. I’m so happy to read this. This is the kind of manual that needs to be given and not the random misinformation that’s at the other blogs. Appreciate your sharing this best doc.

Leave a comment