How to use GeSHi for syntax highlighting with WordPress and DokuWiki

WordPress

  1. Install the WordPress plug-in “WP-GeSHi-Highlight".

  2. Check if GeSHi has been set to use a CSS file instead of inline styles.
    It’s already the default for “WP-GeSHi-Highlight”.
    If in doubt, search in /wp-content/plugins/wp-geshi-highlight/wp-geshi-highlight.php for $geshi->enable_classes().

  3. Applying your own style:

    By default, the wp-geshi-highlight.css in the plugin directory is inserted in the HTML head. You can permanently change the default code block style by placing your own wp-geshi-highlight.css in WordPress’ stylesheet_directory (which usually is the theme style directory). If WP-GeSHi-Highlight finds it there, it takes precedence and is inserted into the HTML head instead of the default file. Obviously, such custom styling survives WP-GeSHi-Highlight updates.
    From gehrcke.de

    Copy the file wp-geshi-highlight.css to site/wp-content/themes/theme/.
    You could then add/change the styles in your theme’s wp-geshi-highlight.css.
    Copy the language file and rename it (to prevent it being overwritten on the next update of the plug-in), then modify it and use that one for the lang="foo" setting.

Use <pre lang="<em>language</em>" line="1">...</pre> for a source code block.

DokuWiki

  1. Check if GeSHi has been set to use a CSS file instead of inline styles.
    It’s been already the default in “DokuWiki” for a while it seems: https://bugs.dokuwiki.org/index.php?do=details&task_id=167
    If in doubt, search in site/wiki/inc/parserutils.php for $geshi->enable_classes().

  2. Configure the global color and style. Look in /wiki/lib/styles/screen.css for this:

    /* syntax highlighting code */
    .code .br0  { color: #66cc66; }
    [...]
    

Reference(s)