Thursday 8 March 2012

GeSHi - Generic Programming Code Syntax Highlighter


Code syntax highlighter written in PHP
http://qbnz.com/highlighter/

You can easily interface with blogger/blogspot by using the demo website and copying out the CSS for your chosen language. Each language will have a different CSS stylesheet, so if you have to tweak one language to fit your blogspot template, then you will need to apply this to the others.

Examples

Default code block stylings
This is a standard code block [<code>This is a standard code block</code>]


Using GeSHi stylings
Code Snippet
  1. This is an example code snippet
  2. # Here is a comment, btw we are using Bash code highlighting
  3.  
  4.   if [ $THIS -eq 999 ]; then
  5.     eval "lets evaluate something here"
  6.   fi
  7.  
  8. # Have fun!
End of snippet

Line numbers are excluded when copying a code snippet to the clipboard also, which is another good thing!

IMPORTANT UPDATE

With BlogSpot/Blogger, if you add a new post and give it a Label with the same name as a chosen language (I.e. Add Python code to a post, and assign a Python Label/Categroy to the post (which is quite common))... Your blog post will appear garbled. This is because Blogger assigns the label to a class and this will take on your CSS styles from GeSHi

Here is a link to a CSS file I have used with most of the languages I talk about in. It support all the default settings, but with word wrap and line numbers both ON. I have prefixed all CSS classes with "sh_" to avoid this problem. Remember to change the class of the main DIV when taking the styles from GeSHi.

Download link for modified CSS

2 comments:

zer0 said...

can you upload the css file back?

zer0 said...

anyone?? please??