Nord-geshi NPM

Features

Getting started

Nord GeSHi is easy to setup. You can use Nord GeSHi in one line of HTML code.

Quick start

Since Nord GeSHi is used in web technology based projects, its main installation methods are therefore npm or yarn, the Node.js package managers.

Install and add it as production dependency from the command line:

# When using npm...
npm install --save nord-geshi

# ...or yarn as package manager.
yarn add nord-geshi

To use Nord GeSHi in projects without Node.js, the CSS file can be used through CDN services like UNPKG:

<!-- This import targets the latest version; replace nord-geshi with nord-geshi@0.5.0 for version locking. @todo Remove this comment in production. -->
<link href="https://unpkg.com/nord-geshi/dist/geshi.css" rel="stylesheet" type="text/css" />

Usage

To use Nord GeSHi, include the CSS file as stylesheet depending on the installation method:

<!-- 1. When installed via npm/yarn for Node.js based projects -->
<link href="node_modules/nord-geshi/dist/geshi.css" rel="stylesheet" type="text/css" />
<!-- 2. When using CDN service like UNPKG -->
<link href="https://unpkg.com/nord-geshi/dist/geshi.css" rel="stylesheet" type="text/css" />

In the example above, the CSS filename is geshi.css. The base name without the file extension, geshi in this case, should be the first CSS class of the GeSHi output's <div> container, i.e:

<div class="geshi text">$geshi = new GeSHi($source, $language);</div>

If there is a overall class name and it's supported in the list below, you will not need to customise PHP or CSS.

Container support

Out of the box, six container classes are supported:

geshi - "standard" customised CSS class (dist/geshi.css: default)
code - popular customised CSS class option (dist/code.css)
highlight - popular customised CSS class option (dist/highlight.css)
codecolorer - CodeColorer Wordpress plugin (dist/codecolorer.css)
wp-geshi-highlight - WP-GeSHi-Highlight Wordpress plugin (dist/wp-geshi-highlight.css: container)
mw-geshi - SyntaxHighlight_GeSHi MediaWiki extension (dist/mw-geshi.css: container)

The files marked 'container' will style any GeSHi language wrapper as a child of the container. This differs to normal GeSHi behaviour, where the container's language selector qualifies the overall class.

Customisation

In order to apply Nord GeSHi to <div> containers, you may need to edit the GeSHi package's source code. You need to set the overall CSS class to the base name of your chosen stylesheet (without the .css file extension).

There are two ways to change the container's overall class name. For both, replace 'ADD_YOUR_CLASS_HERE' with the name you have chosen (e.g. 'geshi').

If you are using a PHP wrapper that instantiates GeSHi (geshi.php) as $geshi, remove any lines with set_overall_class and insert the second line after:
```
// @todo Insert this line after `$geshi = new GeSHi( ... );`, then remove this comment.
$geshi->set_overall_class('ADD_YOUR_CLASS_HERE');
```

If you are using GeSHi more directly, just locate and modify geshi.php (1.0.8.11 - ^1.0.9.0) more directly:

// @todo Add back the keyword before the dollar sign in `$overall_class` (`var` or `protected`), then remove this comment.
$overall_class = 'ADD_YOUR_CLASS_HERE';

If you need help with this, see the GeSHi documentation or request help on Github.

You are also free to fork the stylesheet to your own domain and replace the name. Use one of the stylesheets not marked as "container" in the Usage section.