Mr. .NET

Download: syntax_highlighter_v1_2_2.zip

A couple of bug fixes:

• Nish told me that some additional characters were getting escaped twice by WordPress so the fix_wp_pre function was modified to re-escape those correctly.
• Torkar notified me that the line numbers didn’t indent correctly when starting with line 0. I also took the time to support starting with negative line numbers.

And one new feature:

• The spaces to align the numbers can either occur on the left or right side of the number now. This is a site-wide setting so you can’t change it for a single post. Open up syntax_highlighter2.php. If you set $rightAlignLineNumbers to true then the spaces will appear on the left of the number, making the numbers line up on the right side. If you set $rightAlignLineNumbers to false then the spaces will appear on the right side of the number, making the numbers line up along the left side.

Update: Placed this post in the right category…can’t believe it took two days to notice that
Update2: HAHHAAHHAAHAHA! I can’t believe I’ve edited this post once already and never noticed that I didn’t link to the new download.

A new day (yesterday)* a new release of the syntax highlighter plugin.

This one adds support for line numbers; whether line numbers are displayed and the starting line number is controlled through attributes to the pre tag.

<pre lang=[cpp|cppcli|csharp|php|html|css|xml|xsl|text]
  useLineNumbers=[true|false] startingLineNumber=[1|...]>
// Your code here
</pre>

Case doesn’t matter for the useLineNumbers or startingLineNumber attribute names but the values are case sensitive.

Download Syntax Highlighter v1.2 (23.9Kb). Installation is simple, extract the zip file to your WordPress installation directory and modify syntax_highlighter2.php the 'default' => 'csharp', line to tell the highlighter how it should colorize pre tags that don’t have the lang attribute set, or set to a valid value.

Once that is done you need to add some CSS classes to your sites stylesheet:

pre span.linenumber {
    color: gray;
    border-right: 1px solid gray;
}

pre span.comment {
    color: green;
}

pre span.keyword {
    color: blue;
}

pre span.number {
    color: red;
}

pre span.string {
    color: #990000;
}

Once that is done upload the files to your webserver and you should be ready to go.

*A New Day Yesterday, Stand Up – Jethro Tull

Nish loaded up the new Syntax Highlighter on his test blog and found that some characters were getting escaped to HTML before my code got to run through them. Since it doesn’t happen on my site I assume this is something that has changed between the April 15th nightly and April 25th nightly of WordPress.

So there is yet another release tonight to get rid of those evil character escapes.

Tomorrow there will be one more release to add line number support and to fix any more character escapes that Nish finds tonight.

Download syntax_highlighter2.zip (23.4Kb).

The HTML example at the end of the original post does have an extra closing div tag in it. That was a mistake on what I added to the pre tag and isn’t caused by the syntax highlighter. But I’ll leave it be so yet another post doesn’t come up as modified in RSS readers.

Thanks to liberal application of some regular expressions I was able to write my own syntax highlighter and it is now used on this site.

I based some of the ideas off of Beautifier but all of the code is mine except for the keyword list which was pulled from the Beautifier language defs.

Best of all, the code is fairly clean; without tons of hacks added in just to make it work with some code I didn’t write.

Download Syntax Highlighter 2 (23.2Kb) for WordPress, including language files for C++, C++/CLI, C#, HTML, and CSS. More may be added later or you can make your own by following the pattern set by the 4 included.

Installation is simple, extract to your WordPress directory, then login and enable the Syntax Highlighter 2 plugin. It takes care of the rest from there. Adding syntax highlighting to your posts is simple:

<pre lang=[cpp|cppcli|cs|html|css]>
// your code here
</pre>

Next add the following CSS classes to your .css file to get the same coloring I use here

pre .comment {
  color: green;
}

pre .keyword {
  color: blue;
}

pre .string {
  color: #990000;
}

pre .number {
  color: red;
}

Enjoy!

Update: Added samples of each of the formats below, use the more link to see them. Also added support for PHP, XML, and XSL

In the next version I plan to add support for line numbering, and I might even get that done tonight.

Update: It figures, the one thing I didn’t test in all off the new languages is broken. Comments might not work in HTML, XML, or XSL. I’ll update again as soon as its working again

Update: Comments in HTML, XML, and XSL are working again; the problem was in how I was keeping track of each match. Originally I was using an associative array where the key to the array was the index into the original string where the match occurred. But what happens when you have two matches start at the same index? The second match overwrites the first one.

Now the array isn’t associative and the array index has no bearing on the actual position in the string. I then sort it with my own sorting function so that it is arranged in index order with comments taking precedence over the other types of matches.

Read the rest of this entry »

Since WordPress is GPL’d I figured it was time I offered up the changes I’ve made to the site. Most are pretty hackish but they suit my needs for now.

FixPRE (1.22KB) removes the line break/paragraph formatting that WordPress automatically adds to all posts, regardless of whether the text is inside of a pre tag. Some of the later nightly builds of WordPress remove the <br /> tags that get added but they leave the <p></p> tags that it generated.

Syntax Highlighter (78.2KB) tries to add some syntax highlighting to code within pre tags. It uses the rather good and slightly modified Beautifier script to perform the highlighting. Unfortunately it likes to format code as well as add syntax highlighting so it isn’t a perfect solution. It also doesn’t like to format HTML code, the downsides of trying to combine a tool meant to format regular code and not code that has been auto-formatted by a CMS tool.

The regex’s used by both were written before I bought the book I push below so don’t think the poor regex’s in my code are caused by the book

Update: Nish figured out the fixes needed to get the syntax highlighter to reformat our already formatted code. Simply commenting out a few lines and changing a trim to rtrim was all that was needed. The zip file has been updated with the latest code.