Recommended releases

Download Links

Adds a shortcode integration for using Highlight.js in the WYSIWYG editor.


  1. Enable the bundle like any Backdrop module.
  2. Add it to the WYSIWYG Editor by choosing a text format under "admin/config/content/formats".
  3. On your text format settings, check "Enable Insert Code Syntax shortcode" under the shortcode settings and "ShortCodes" under the "enabled filters"
    select list.
  4. Add the "{code}" button to "Avaiable Toolbar".
  5. Add the Highlight.js bundled library from the Highlight.js project bundler to a new /libraries directory in
    this module's root folder, e.g /libraries/highlightjs/.


When you edit a node using the WYSIWYG text filter, you'll see button with brackets that allows you to enter code syntax.

screen shot 2018-05-18 at 2 38 01 pm

Once the dialog window is open, you can choose the language and insert the code syntax.

screen shot 2018-05-18 at 2 43 26 pm

Then you will see a shortcode [code lang="php"]$foo = "bar";[/code] inserted into the body field with line breaks and indentation preserved.

screen shot 2018-05-18 at 2 43 58 pm

Once saved, the code is rendered with syntax highlighting. You can change the theme by setting a variable, drush vset csh_theme sunburst, and the
themes are located at

screen shot 2018-05-18 at 2 44 25 pm


Bugs and Feature requests should be reported in the Issue Queue:

Current Maintainers

  • Seeking maintainers



This project is GPL v2 software. See the LICENSE.txt file in this directory for
complete text.