- Not to be confused with CodeEditor.
Release status: stable
|Provides syntax highlighting in wikitext editor
|Pavel Astakhov (pastakhovtalk)
|Snapshots releases along with MediaWiki. Master is not backward compatible.
|GNU General Public License 2.0 or later
|353 (Ranked 17th)
|Public wikis using
|6,549 (Ranked 62nd)
|Translate the CodeMirror extension if it is available at translatewiki.net
|Open tasks · Report a bug
The CodeMirror extension provides syntax highlighting in MediaWiki's wikitext editor. It adds a button with the icon 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 switched on, it will replace the standard textarea with the editor provided by CodeMirror library. When switched off, it will switch back to the standard textarea.
The colors used in this extension have been optimised for higher contrast, accessibility and better readability and now conform to the Web Content Accessibility Guidelines (WCAG 1.4.3 AA). The colors provide better access for people with limited vision as well as for users working in bright daylight conditions. (more information)
Bracket matching edit
This feature highlights the innermost pair of brackets when the cursor lies between any bracket pair, and when the cursor lies directly next to a bracket, the feature highlights the corresponding matching bracket. Bracket matching is active in both editors when syntax highlighting is turned on in any namespace using these editors.
Line numbering edit
In the wikitext edit mode line numbers are automatically displayed in both editors.
Line numbering in 2010 wikitext editor
Line numbering in 2017 wikitext editor
Colorblind mode edit
For users who have difficulty distinguishing between colors, CodeMirror offers a colorblind-friendly mode. This feature can be activated on wikis with CodeMirror enabled by navigating to the Special:Preferences page.
With the colorblind-friendly scheme active, the colors of the following page elements change:
|Headings, symbols, signatures, section names, magic words
|HTML tags, references, mathematical expressions
In addition, background highlights and colors are removed from all text and objects. Bolding and underlining behavior remains unaffected.
Browser support edit
All browsers supported by MediaWiki are supported.
- Install either the WikiEditor extension or the VisualEditor extension, as instructed on their pages; at least one of these is required for this extension to work.
- Download and move the extracted
CodeMirrorfolder to your
Developers and code contributors should install the extension from Git instead, using:
git clone https://gerrit.wikimedia.org/r/mediawiki/extensions/CodeMirror
- Add the following code at the bottom of your LocalSettings.php file:
wfLoadExtension( 'CodeMirror' );
- Configure as required.
- Done – Navigate to Special:Version on your wiki to verify that the extension is successfully installed.
- If using Vagrant, install with
vagrant roles enable codemirror --provision
Add the following code at the bottom of your LocalSettings.php.
# Enables use of CodeMirror by default but still allow users to disable it
$wgDefaultUserOptions['usecodemirror'] = true;
- Restrict line numbering to specific namespaces. Defaults to null, which enables it for all namespaces. Set to  to disable everywhere.
- Temporary feature flag to control the migration to CodeMirror 6 (phab:T259059).
- An array of gadget names that, if enabled, will prevent CodeMirror from loading. Defaults to wikEd.
Extension integration edit
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.
The following front-end hooks are used in this extension:
|Whether the CodeMirror editor is now shown
|The current "editor", which is either the normal
<textarea /> or the
If you need to interact with the contents of a CodeMirror instance, use jQuery.plugin.textSelection.
To do edit
- Unfortunately, right-to-left content is not supported. (task T170001)
- highlighting definition lists ( ;foo :bar ) (task T170042)
- auto-completion (task T95100)
- code folding (task T166098)
- highlighting inside gallery tag (<gallery> foo | bar </gallery>)
See also edit
- Overview of missing features and bugs: MediaWiki-extensions-CodeMirror
- User:Remember the dot/Syntax highlighter
- Community Tech/Wikitext editor syntax highlighting - includes information on customizing the colors
- c:Category:MediaWiki extension CodeMirror
|This extension is being used on one or more Wikimedia projects. This probably means that the extension is stable and works well enough to be used by such high-traffic websites. Look for this extension's name in Wikimedia's CommonSettings.php and InitialiseSettings.php configuration files to see where it's installed. A full list of the extensions installed on a particular wiki can be seen on the wiki's Special:Version page.
|This extension is included in the following wiki farms/hosts and/or packages: