Displaying code with Syntax Highlighting on websites and blogger


Vinh Nguyen


June 1, 2009

This actually took me quite some time as some information out on the web are deprecated and because I have little to no knowledge of html, javascript, and css.

Use Syntax Highlighting, the latest version being here. Set up instructions here. Note that the code for the two css files are not closed correctly, so u need to change the closing to '/>'. For blogger, there is some kind of

issue, and i don't want to turn the line break feature on blogger off, so based on the comment at the end of the page, add 'SyntaxHighlighter.config.bloggerMode = true;' to the code.

To use in blogger, type, in html mode,

<pre class="brush:js">

code in here


where you type whatever language you want after brush:. Here is a list.

Example 1:

{c} testing;



Paste the following in after HEAD declaration in the blogger template. I am using the Emacs theme of course. NOTE I GUESS SYNTAX HIGHLIGHTER IS NOT DISPLAYING the \"/\>\" when the two css files end, REMEMBER to do so!


<link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css">

<link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeEmacs.css" rel="stylesheet" type="text/css">

<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js'" type="'text/javascript'/">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js'" type="'text/javascript'/">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js'" type="'text/javascript'/">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js'" type="'text/javascript'/">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js'" type="'text/javascript'/">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js'" type="'text/javascript'/">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js'" type="'text/javascript'/">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js'" type="'text/javascript'/">
<script src="'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js'" type="'text/javascript'/">
<script type="'text/javascript'">
SyntaxHighlighter.config.bloggerMode = true;


When pasting html / javascript, etc, if blogger gives an error, just hit ignore!

Copy and paste code by hitting the view source icon!