Home

Awesome

Enlighter - Customizable Syntax Highlighter

Contributors: Andi Dittrich, aenondynamics Tags: syntax highlighting, syntax highlighter, highlighter, highlighting, classic editor, gutenberg, javascript, code, coding, sourcecode,customizable, visual editor, tinymce, themes, css, html, php, js, xml, c, cpp, c#, ruby, shell, java, python, sql, rust, matlab, json, ini, config, cython, lua, assembly, asm Donate link: https://enlighterjs.org Requires at least: 6.0 Tested up to: 6.1 Stable tag: 4.6.0 License: GPL-2.0 License URI: https://opensource.org/licenses/gpl-2.0.php

All-in-one Syntax Highlighting solution. Full Gutenberg and Classic Editor integration. Graphical theme customizer. Based on EnlighterJS.

Description

Enlighter is a free, easy-to-use, syntax highlighting tool for WordPress. Highlighting is powered by the EnlighterJS javascript library to provide a beautiful code-appearance.

Using it can be as simple as adding a new Enlighter Sourcecode block (Gutenberg) and insert the code which you want to highlight: Enlighter takes care of the rest!

An easy to use Theme-Customizer is included to modify the build-in themes without any css knowlegde! It also supports the automatic creation of tab-panes to display code-groups together (useful for multi-language examples - e.g. html+css+js)

Plugin Features

Gutenberg Editor Integration

Classic Editor (TinyMCE) Integration

Markdown

Compatibility/Migration

Extensions

Texteditor/Shortcodes (Legacy)

Shortcodes are deprecated and should be used in text editor mode only - never use them within Gutenberg Editor or Classic Editor!

Supported Languages (build-in)

In case your language is not available try the Generic Mode which covers a lot of programming languages - or request a new language on GitHub

Related Links

Compatibility

All modern webbrowsers with enabled Javascript and HTML5 capabilities for "data-" attributes are compatible with Enlighter. It's possible that it may work with earlier/other browsers.

Installation

System requirements

Installation

  1. Download the .zip file of the plugin and extract the content
  2. Upload the complete enlighter folder to the /wp-content/plugins/ directory
  3. Activate the plugin through the 'Plugins' menu in WordPress
  4. Goto to the Enlighter settings page and select the default theme which should be used.
  5. That's it! You're done. Just go into your editor and add an Enlighter codeblock via Gutenberg Blocks menu or Classic Editor toolbar

Screenshots

  1. HTML highlighting Example (Enlighter Theme)
  2. Visual Editor Integration
  3. Visual Editor Code Settings
  4. Visual Editor Inline/Block Formats
  5. Options Page - Appearance Settings
  6. Options Page - Advanced Settings
  7. Theme Customizer - General styles
  8. Theme Customizer - Language Token styling
  9. Special options for use with a CDN (Content Delivery Network)
  10. Tab-Pane Example (multiple languages)
  11. Frontend Editing using wp_editor feature
  12. Theme Customizer - Live Preview-Mode

Upgrade Notice

4.3

Everything has been changed - read enlighterjs.org/wp-v4 before upgrading - THIS RELEASE IS NOT BACKWARD COMPATIBLE

Frequently Asked Questions

The WordPress plugin related FAQ page is available on GitHub within the documentation repository!