Use GeSHi To Syntax Highlight Code on Your Site with Static CSS

February 24, 2014

This is how I use GeSHi to format the code displayed on this blog.

In the contrib directory of GeSHi there are a couple PHP scripts. One of them can be used to generate a static CSS file that includes all the styling for all languages. This is preferred to prevent the heavy amount of html that will be generated if CSS is not used.

php cssgen2.php > geshi.css
Then, just include the css file directly in your page header.
<link href="css/geshi.css" type="text/css" rel="stylesheet" />

The code() function is essentially the filter that runs my content text through GeSHi.

function code($match) 
{
   $geshi = new GeSHi(nobr($match[2]), $match[1]);
   $geshi->enable_classes(); // tell GeSHi to use CSS
   return $geshi->parse_code();
}

The code() function is called by to_page() which is a function that parses {code=TYPE}{/code} tags from my markup language. TYPE is the GeSHI supported language identifier.

function to_page($text)
{
   // code tags
   $text = preg_replace_callback('~\{code=(.+?)\}(.+?)\{\/code\}~is', 'code', $text);
 
   return $text;
}

Related Posts