Extension:SyntaxHighlighterAndCodeColorizer

From MediaWiki.org
Jump to: navigation, search
MediaWiki extensions manual - list
Crystal Clear action run.png
Syntax Highlighter and Code Colorizer

Release status: stable

Implementation Variable
Description Highlight Syntax and Color Code using javascript.
Last version 3.0.83 (02 July 2010)
MediaWiki any
License LGPLv3
Download Latest

Other versions

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

Check usage (experimental)

Contents

[edit] Introduction

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

[edit] Supported languages

  • 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)

[edit] Example

See it in action:

[edit] Usage

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>";
}

[edit] Download instructions

Download

[edit] Installation

To install this extension, add the following to LocalSettings.php:

require_once(”extensions/syntax-highlighter-code-colorizer/syntax-highlighter-mediawiki.php”);

You might get an error when you access your wiki in the browser. This can be because of the "-". To remedy to that problem, you can change to :

require_once(”extensions/syntax/highlight.php”);

Where highlight.php is the same as syntax-highlighter-mediawiki.php, but changed accordingly to the new paths according to what is below.

[edit] Code

<?php
 
if (!defined('MEDIAWIKI')){
    die();
}
 
global $wgHooks;
$wgHooks['BeforePageDisplay'][]  = 'setupHeadersForHighlight';
 
function setupHeadersForHighlight($out)
{
    global $wgScriptPath;
 
    $out->addScript('<link rel="stylesheet" type="text/css" href="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/styles/shCore.css'.'"></link>'."\n");
    # default style
    $out->addScript('<link rel="stylesheet" type="text/css" href="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/styles/shThemeDefault.css'.'"></link>'."\n");
    # alternative styles
    # $out->addScript('<link rel="stylesheet" type="text/css" href="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/styles/shThemeDjango.css'.'"></link>'."\n");
    # $out->addScript('<link rel="stylesheet" type="text/css" href="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/styles/shThemeEclipse.css'.'"></link>'."\n");
    # $out->addScript('<link rel="stylesheet" type="text/css" href="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/styles/shThemeEmacs.css'.'"></link>'."\n");
    # $out->addScript('<link rel="stylesheet" type="text/css" href="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/styles/shThemeFadeToGrey.css'.'"></link>'."\n");
    # $out->addScript('<link rel="stylesheet" type="text/css" href="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/styles/shThemeMidnight.css'.'"></link>'."\n");
    # $out->addScript('<link rel="stylesheet" type="text/css" href="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/styles/shThemeRDark.css'.'"></link>'."\n");

    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shCore.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushAS3.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushBash.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushCpp.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushCSharp.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushColdFusion.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushCss.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushDelphi.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushDiff.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushErlang.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushGroovy.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushJava.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushJavaFX.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushJScript.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushPerl.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushPhp.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushPlain.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushPowerShell.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushPython.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushRuby.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushScala.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushSql.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushVb.js'.'"></script>'."\n");
    $out->addScript('<script type="text/javascript" src="'.$wgScriptPath.'/extensions/syntax-highlighter-code-colorizer/scripts/'.'shBrushXml.js'.'"></script>'."\n");
 
    $out->addScript('<script type="text/javascript">' . 'SyntaxHighlighter.all();' . '</script>'. "\n");
 
    return true;
}
?>

If you've changed your pathname because of the problem caused by the "-", you should change all the pathnames above to the new pathname (in our example, '/extensions/syntax/...').

[edit] Alternative installation

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.

[edit] See also

Personal tools
Namespaces

Variants
Actions
Navigation
Support
Download
Development
Communication
Print/export
Toolbox