UPDATE: This add-on is for Statamic V1 -- Deprecated!

This is the addon for Statamic V1. The development and support has stopped. The version for Statamic V2 can be found here.


This add-on adds Highlight.js v 9.0 code highlighting to your pages.
All codeblocks are color-coded/highlighted according to the selected theme.


Clone or Copy the files to their destination

Clone this project on your system:

cd webfolder/_add-ons
git://github.com/mwesten/Plugin-Highlight.git highlight

Or download the project and add the contents of archive to the _add-ons/highlight folder.

Add the highlight init code to your head

Open the theme file layout (for example) _themes/london-wild/layouts/default.html
Add the following code in your <head> section:{{noparse}}

{{ highlight:head }}

This displays the highlight.js in the default theme.
You can also select one of the added themes that you can find in the _add-ons/highlight/highlight/styles folder; for example the Sunburst theme:{{noparse}}

{{ highlight:head style="sunburst"}}

If you like you can add the code just before your body close tag instead of in your <head>. This is a matter of preference.


When codeblocks are used (1 tab or 4 spaces) Highlight.js tries to guess what code is used. (You can inspect the class on the generated <pre><code class="php"> … </code></pre> codeblock to see how it was interpreted.)
If the autodetection didn't work out correctly or you just want control over the rendering, just wrap the code in a manual codeblock and add the language to the code class.
See for more information the Highlight.js documentation.