Extension:CodeMirror

Other languages:
Deutsch • ‎English • ‎Türkçe • ‎español • ‎français • ‎magyar • ‎português do Brasil • ‎sicilianu • ‎čeština • ‎українська • ‎中文 • ‎日本語 • ‎한국어
MediaWiki extensions manual
OOjs UI icon advanced.svg
CodeMirror
Release status: stable
Pride and codemirror.png
Implementation User interface
Description Provides syntax highlighting in wikitext editor
Author(s) Pavel Astakhov (pastakhovtalk)
Latest version 4.0.0
Compatibility policy release branches
MediaWiki 1.32+
PHP 5.3+
Database changes No
License GNU General Public License 2.0 or later
Download
Translate the CodeMirror extension if it is available at translatewiki.net
Check usage and version matrix.
Vagrant role codemirror
Issues Open tasks · Report a bug

The CodeMirror extension provides syntax highlighting in MediaWiki's wikitext editor. It adds a button with the icon Codemirror-icon.png to the editing toolbar that allows for switching syntax highlighting on and off. It supports the 2010 WikiEditor toolbar as well as the VisualEditor toolbar.

By default it is switched off. When switching on, it will replace the standard textarea with the editor provided by CodeMirror library. When switching off, it will be the opposite effect.

You can use your own styles for wikitext highlighting. Used styles available here. You should place your own styles to common.css. If you have found better styles please let me know.

Browser supportEdit

It is not fully tested yet!

All browsers supported by MediaWiki are supported. Modern mobile browsers tend to partly work.

ScreenshotsEdit

Live demo.

InstallationEdit

  • If using Vagrant , install with vagrant roles enable codemirror --provision
Manual installation

ConfigurationEdit

# Enables use of CodeMirror by default but still allow users to disable it
$wgDefaultUserOptions['usecodemirror'] = 1;

Add the above code at the bottom of your LocalSettings.php .

For color and style customization, see Meta help page.

Extension integrationEdit

If your MediaWiki extension adds a new tag and you want to make sure CodeMirror properly highlights the content within it, you can add CodeMirror support to your extension. Here are two examples: Cite extension and PhpTags extension.

To doEdit

See alsoEdit