Saturday, November 28, 2009

how to highlight syntax in source code cited in google blog

It is easy to highlight source code syntax in your blog. The key is an open source project called SyntaxHighlighter. It is a wonderful tool to help you to highlight more than 20 computer languages in the Web page. We only need to highlighted syntax for source code cited in your web page,
  1. Include/link Syntaxhighlighter's Javascript file and CSS file in your web page.
  2. put the source code in tag pair <pre class="brush: java"></pre>
    . brush can be Java, PHP, SQL and more than twenty language names.
In case of google blog, we can enable SyntaxHighlighter in the following steps too,
  1. login your google blogger and navigate with path Design --> Edit HTML 
  2. insert the HTML tags in bottoms in the HTML template. I inserted it in the tag in order to make sure these scripts are loaded before the page will be displayed. But, you can insert it in other place too. 
  3. surround your source code with <pre> tag and specify proper brush name according to your source code.

No comments:

Post a Comment