About Prism Syntax Highlighter

Prism JS Syntax Highlighter

Category Text Formatters
Textformatter modules that provide run-time formatting for blocks of text (typically used with Text/Textarea fields).
Release StateBeta
Close to stable, but users are advised to be cautious and test thoroughly.*
Module Version1.0.1
Class NameTextformatterPrism
Date AddedJanuary 12, 2017
Last UpdatedFebruary 5, 2017
Recommended ByNew recommendations may take up to 1 day to appear.


This module's files should be placed in /site/modules/TextformatterPrism/
How to install or uninstall modules


ProcessWire Prism JS Syntax Highlighter

A module to parse given HTML and syntax-highlight code elements using Prism



  • Add module to /site/modules/ and then install.
    Or go to Modules > Install > Add New and use any of the options provided to to install.
  • Create a text/textarea field and pick Prism Syntax Highlighter from Details > Text Formatters.

    Protip: This module parses HTML markup, so it should come after HTML parsers such as Markdown textformatters.

  • Add code elements within the field content with language-xxxx classes.Or pick a default language from configuration page if you are unable to specify the classes.

  • Select any plugins you want. To use some plugins, extra classes are required. See plugin documentation.

  • Install these recommended modules for the best experience:


  • Go to module configuration to specify:
    • Auto inclusion of highlighters for parsed languages
    • Default language for inline code elements or ones without language-xxxx classes.
    • Ability to use minified/non-minified component and parser files
    • Plugins
    • Theme
    • Custom JS and CSS for configuration / theming
  • Ability to use hooks to specify custom CSS and JS


Hook into TextformatterPrism::getCustomCss and TextformatterPrism::getCustomJs in your ready.php file and return an (array of ) URLs as follows:

// specify custom CSS
wire()->addHookAfter('TextformatterPrism::getCustomCss', function (HookEvent $event) {
    $event->return = 'path/to/custom.css';
// Specify custom JS
wire()->addHookAfter('TextformatterPrism::getCustomJs', function (HookEvent $event) {
    $event->return = ['path/to/custom.js', 'another/custom.js'];


No comments yet. Be the first to post!

Post a Comment

Your e-mail is kept confidential and not included with your comment. Website is optional.