Sunday, April 5, 2009

Blogger Causing Problems for SyntaxHighlighter

I kept noticing blog entries with beautifully rendered source code snippets and finally clicked the blue question mark in the upper left of one and discovered that they were using Alex Gorbatchev's SyntaxHighlighter JavaScript library. For my last post, I followed the instructions in the Usage Guide, using the hosted version since I can't upload JS files to Blogger, at least as far as I know. If you look at my post, you'll notice that I have two 1 line Groovy snippets and one 5 line Java snippet. The 1 liners were no problem, but when I first tried to display the 5 lines of Java it showed up as just one line with visible <br> tags where the line breaks should have been. It turns out that when I pasted the code into Blogger's post editor, even though it was in HTML source mode, it inserted <br> tags for the line breaks even though they were showing up inside of a <pre> tag. It turns out that there are two solutions to the problem. I'll explain the better one first, although I didn't find out about it until trying the other one.

When I asked Google for help, it led me to a page talking about how to use SyntaxHighlighter with Blogger. The post itself didn't contain any new information for me, but the comments were useful. "Robje" had apparently experienced exactly the same problem as me. "Debiprasad" then asked, "What is your settings for 'Convert line breaks' set to? In my case, if I set it to 'Yes', it's inserting <br/> into codes defined under <pre> tag." Ah ha! I looked on the "Formatting" subtab under the "Settings" tab in the Blogger control panel and discovered that mine was set to "Yes". Ack! What an annoying default! With it set to "No", it seems to fix the problem.

In case that doesn't work for you, Google also brought me to a page on what must been the old home for SyntaxHighlighter. Once again, the gold was in the comments. "fahd.shariff" mentioned that if you use the post editor in Blogger in Draft, this isn't a problem. As I said earlier, I gave this a try before finding the preferable solution and it worked for me so it's a reasonable solution to fall back on.


Post a Comment