Use dp.SyntaxHighlighter to implement code highlighting for Blogger.

by billconan on 2006-10-06 21:41:02

Several friends have asked me which syntax highlighting component I use, assuming that my Blogger settings must be special. In fact, I haven't done much in terms of configuration. Generally, I use pre-generated HTML code and paste it into my posts. For example, Vim can generate highlighted HTML code, while Eclipse and Visual Studio allow you to copy styled code as RTF format. Many editors have this functionality. Additionally, you can use online code highlighting tools like http://www.geshi.org.

Another syntax highlighting component that can be used in Blogger is a JavaScript-based one called dp.SyntaxHighlighter. You can actually see it in many places. You can check out its demo first. It supports quite a few common programming languages, though it offers less support compared to GeSHi, which is still sufficient for most needs.

The specific usage is as follows: First, download the component and upload the `shCore.js` file and the language-specific files (like `shXXX.js`) from the Scripts folder, along with the `SyntaxHighlighter.css` file from the Styles folder to a hosting location. If customization is needed, you can modify based on `TestPages.css`. Then, add the following code at the end of the body element in your Blogger template: