From MediaWiki.org
Jump to navigation Jump to search
MediaWiki extensions manual
OOjs UI icon advanced.svg
Syntax Highlighter and Code Colorizer
Release status: stable
Implementation Variable
Description Highlight Syntax and Color Code using JavaScript
Latest version 3.0.83 (2010-07-02)
Database changes No
License GNU Lesser General Public License 3.0
Example <pre class="brush:[code-alias]"> …Your Code Here </pre>
Translate the SyntaxHighlighterAndCodeColorizer extension if it is available at translatewiki.net
Check usage and version matrix.


Highlight syntax and color code using JavaScript. This plugin integrates Alex Gorbatchev’s Syntax Highlighter Tool.

Supported languages[edit]

  • ActionScript 3
  • Bash/shell
  • ColdFusion
  • C#
  • C++
  • CSS
  • Delphi
  • Diff
  • Erlang
  • Groovy
  • JavaScript
  • Java
  • JavaFX
  • Perl
  • PHP
  • Plain Text
  • PowerShell
  • Python
  • Ruby
  • Scala
  • SQL
  • Visual Basic
  • XML
  • Custom languages (several have already been created)


See it in action:


Just surround your code like this (note that your code must be HTML escaped):

<pre class="brush:[code-alias]"> ...Your Code Here... </pre>

or like this:

<script type="syntaxhighlighter" class="brush: js"><![CDATA[ ...Your Code Here... ]]></script>

Replace the [code-alias] segment with the type of code you have. For a list of all available brush aliases, see here. There's some pros and cons for each of the above options here.

Admins can provide additional aliases (like <plsql> your code </plsql>) by adding to the extension file code like this:

// This is a comment. Comments are not displayed in the browser //
$wgHooks['ParserFirstCallInit'][] = 'syntaxHighlightingExtension';
function syntaxHighlightingExtension( &$parser ) {
    $parser->setHook( 'PLSQL', 'syntaxHighlightingRenderHtml' );
    return true;

function syntaxHighlightingRenderHtml($input, $args, $parser, $frame){
    return "<pre class=\"brush:sql\">\n" . $input . "</pre>";


  • Download the latest version of SyntaxHighlighter and extract the files in a directory called Syntax in your extensions/ folder.
  • Add the code from the files under #Code section on this page to this directory.
  • Add the following to LocalSettings.php:

Alternative installation[edit]

Alternatively, you could handle the installation of the appropriate files and the generation of this content all with a script. An example of this can be seen here.

See also[edit]