Michael Sync

Wordpress.com added new feature that allows you to post the sourcecode on your blog in very easy way. You don’t need to do anything about manual color highlighting for your sourcecode. You don’t need to find the theme which has a stylesheet defined for PRE or CODE tag. You can just paste the sourcecode within [sourcecode language=’css’]…[/sourcecode] and specify the language of your sourcecode. How easy it is!!

using System.Data.Linq;
using System.Data.Linq.Mapping;

[Table(Name = "Customers")]
public class Customer
{
[Column]
public string CustomerID { get; set; }
[Column]
public string City { get; set; }

public override string ToString()
{
return CustomerID + "\t" + City;
}
}

static void Main(string[] args)
{
DataContext db = new DataContext(
@"Data Source=.\sqlexpress;Initial Catalog=Northwind");
db.Log = Console.Out;
var results = from c in db.GetTable<Customer>()
where c.City == "London"
select c;
foreach (var c in results)
Console.WriteLine("{0}\t{1}", c.CustomerID, c.City);

}

The most of tech bloggers including me are very happy with this new feature.

What about for self-host wordpress bloggers? Is there any plug-in for syntax highlighting?

UPDATED: Please check the updated information at the bottom of this post.. Thanks

Of course! Yeah. There are a lot of plug-ins for syntax highlighting. But if you wanna use something looks exactly like the one from wordpress.com then you may probably check-out the plug-in called SyntaxHighlighter that uses javascript syntax highlighting library which is used by wordpress.com to implement that new feature.

Where can I get “SyntaxHighlighter” plug-in?

Download from this link “http://erik.range-it.de/wordpress/plugins/syntaxhighlighter/“. (Of course! it is free.)

How to install and configure “SyntaxHighlighter” plug-in?

• Extract the zip file (”syntax.zip” for now)
• Copy all files and folders (syntax.php, [Styles] and [Scripts])
• Paste them under wordpress/wp-content/plug-ins/
• Open the browser and Go to Plug-in page (eg: http://localhost/wordpress/wp-admin/plugins.php)
• Activate the plug-in
• Go to “Options” tab in the admin panel
• (There will be new tab called “Syntax” in Options panel.) Go to this tab. You will see a lot of options for syntax highlighting as picture below.

• You can specify the languages of your sourcecode that you are going to post on your blog. For example, if all codes that you post on your blog are written C# or Javascript then check the C# and Javascript checkedboxes in this page.
• then, click “Update Options” button.
• finally, you can start posting the sourcecode on your blog.

How to post the sourcecode or How to use this plug-in?

Well. this is very simple.

• Copy the code that you wanna post and paste them within [sourcecode]…[/sourcecode]
• Specify the language of your code. (eg: [sourcecode:javascript]…[/sourcecode] )
• Done!

What is the differences between SyntaxHighlighter plug-in and the one from Wordpress.com?

Firstly, I don’t work for wordpress.com so I’m not sure how they implement this plug-in for wordpress MU. But I believe that both of them are pretty much the same since they are mainly relying on javascript syntaxhighter. I found only two differences as below while I was testing those plug-ins.

1. You can’t specify HTML, XSLT as a language in Wordpress.com.

2. You can’t disable some languages that you are not using in your blog.

Last but not least (Performance)

This link said,

SyntaxHighlighter uses regular expressions to parse the text. It’s not extremely fast, in fact, it’s pretty slow. If you are trying to highlight a few dozens lines of code, you won’t see any problems. Trying to highlight 10kb worth of text will result in JavaScript being aborted because of long execution time.

Other wordpress plug-ins for syntax highlighting

• Wp-syntax (http://wordpress.org/extend/plugins/wp-syntax)
• iG:Syntax Hiliter (http://blog.igeek.info/wp-plugins/igsyntax-hiliter/)
• Wordpress (http://wordpress.org/extend/plugins/syntaxhighlighter/)

UPDATED: I found the original plugin which is written Matt for Wordpress now. This plugin also called SyntaxHighlighter. Here is a link if you wanna download. As this plugin uses the same tag format like wordpress.com, you don’t need to change anything in your post to highlight the correct style.