"Syntax Highlighter" to add code snippet in blogger

Hello Everyone.

This is my first post on this blog. I am writing this blog to provide some quick salesforce developement recipes which will help others.

Before posting any content on the blog, first question for me was, how would I post a code snippet which help other people to understand the logic and implementation. After a lot of research I found "syntax highlighter" which is pretty easy to use. Just use the step mentioned below:

1. Go to http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/SyntaxHighlighter.css, then perform a "select all" and "copy". The css information is now in the clipboard.
2. Paste the css information at the end of the css section of your blogger html template (i.e., after <b:skin><!--[CDATA[/* and before ]]--></b:skin>).).
3. Before the </head> tag, paste the following:
   
   
   
4. Before the </body> tag, insert the following:
   
   



5. Use the "Preview" button to make sure your website is correct, then click "Save Template".


6. When composing a blog entry that contains source code, click the "Edit Html" tab and put your source code (with html-escaped characters) between these tags:
   
   

   
   <pre name="code" class="cpp">
     Your html-escaped code goes here...
   </pre>
   

Substitute "cpp" with whatever language you're using (full list). (Choices: cpp, c, c++, c#, c-sharp, csharp, css, delphi, pascal, java, js, jscript, javascript, php, py, python, rb, ruby, rails, ror, sql, vb, vb.net, xml, html, xhtml, xslt)

See full documentation here for Syntaxhighlighter.

For performing the HTML escaping, you can get a good list of tools by searching for 'html esaper' or a similar term. Here's the one I used while writing this post.

Let me know how it works!