Skip to content

๐Ÿ–น Imperavi Redactor Plugin for adding Code Blocks in your toolbar (multiple languages supported with highlight.js)

Notifications You must be signed in to change notification settings

Mikescops/redactor-codeblock-plugin

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

5 Commits
ย 
ย 
ย 
ย 

Repository files navigation

๐Ÿ–น Redactor Codeblock Plugin

Imperavi Redactor Plugin for adding Code Blocks in your toolbar (multiple languages supported).

This plugin creates <pre><code></code></pre> tags that allows highlight.js to style your code depending on the language.

Usage

A new button is available in the Redactor toolbar, to insert a new code block, the dropdown will suggest you a pre-selected list of languages for syntax highlighting.

You can select text in your content to convert it to a code block.

You can also remove a codeblock by putting your cursor on it and select any language in the dropdown.

Supporting more languages

In the script, you can edit the this.languages to add more code languages to it, the ones you're likely to use.

The are around 196 languages supported, check them here.

How to install in Bolt CMS

Clone this repository (or copy js plugin file content) to the paht: /public/assets/redactor/_plugins/codeblock/codeblock.js.

Edit the config/bolt-redactor.yaml file with the following content:

plugins:
  codeblock: ['../_plugins/codeblock/codeblock.js']

Make sure to add codeblock in the pugins line too:

plugins: [ fullscreen, table, video, imagemanager, definedlinks, alphalist, codeblock]

Resources

Maintainer

twitter/mikescops
Corentin Mors

About

๐Ÿ–น Imperavi Redactor Plugin for adding Code Blocks in your toolbar (multiple languages supported with highlight.js)

Topics

Resources

Stars

Watchers

Forks