MediaWiki VisualEditor

What is MediaWiki VisualEditor?

MediaWiki VisualEditor is a user-friendly rich-text editor for MediaWiki, the software that powers Wikipedia and other Wikimedia Foundation websites. It is designed to make it easier for users to edit Wikipedia articles and other pages on MediaWiki sites, especially for users who are not familiar with MediaWiki's syntax for formatting text.

VisualEditor allows users to edit articles using a WYSIWYG (What You See Is What You Get) interface, similar to word processors like Microsoft Word or Google Docs. This means that users can see how their changes will look on the page as they edit, rather than having to remember and type out special formatting codes. VisualEditor also includes a number of advanced features, such as the ability to add and edit tables, templates, and images, and to insert and format citations and references.

Developed by the Wikimedia Foundation as a way to make it easier for people to contribute to Wikipedia, VisualEditor is available as an optional feature on many MediaWiki sites, and can be enabled or disabled by administrators on a per-wiki basis or, if allowed, by users in their preferences.

There is the VEForAll extension that delivers VisualEditor interface to the textarea inputs provided by Page Forms, CommentStreams, and FlexForm.

Page Forms textarea (“Subtitle”) powered by Visual Editor

Installing and Configuring VisualEditor

To install VisualEditor on a wiki, you will need to have administrative privileges on the wiki. Here are the steps you can follow on MediaWiki 1.39:

1. Enable the VisualEditor extension. You can do this by adding the following lines to your LocalSettings.php file:

wfLoadExtension( 'VisualEditor' ); 

2. After making these changes, go to the Special:Version page to verify that VisualEditor has been installed correctly.

3. By default, VisualEditor is only enabled for the namespaces "Main", "User", "File" and "Category". If you want to enable VisualEditor for a different set of namespaces, you can use the following code in your LocalSettings.php file:

$wgVisualEditorAvailableNamespaces = [
'Project' => true,
'File' => false,
'Extra' => true,
]

4. You can force VisualEditor interface to work in both WYSIWYG and source edit modes by adding:

$wgVisualEditorEnableWikitext = true;
$wgDefaultUserOptions['visualeditor-newwikitext'] = 1;
$wgHiddenPrefs[] = 'visualeditor-newwikitext' ;

Using VisualEditor as source editor

5. By default, VisualEditor creates a separate link for WYSIWYG editing. If you want to have just one link, that will open the last used editor, add the following line to your config:

$wgVisualEditorUseSingleEditTab = true;

6. You can set the editor that will be provided by default. In this example we make VE the default editor:

$wgDefaultUserOptions['visualeditor-editor'] = 'visualeditor';

What are MediaWiki VisualEditor alternatives?

It's worth noting that visual editors are not always the best choice for everyone. Some users may prefer to use the default wikitext editor, which allows them to directly edit the underlying wiki markup. We can use the WikiEditor as an example: it is a built-in editor for MediaWiki that provides basic editing functionality, including the ability to format text, create links, and insert images and tables.

There are a number of alternatives to MediaWiki VisualEditor that you might consider using, depending on your specific needs and preferences:

1. wikEd: This editor is supported and was created by the Wikipedia users. Being a pseudo-WYSIWYG editor actually, it adds a number of features to the standard MediaWiki editor, including syntax highlighting, spell checking, and search and replace functionality. It also includes a number of tools for formatting and organizing text, such as the ability to create tables and insert templates.
   

2. TinyMCE: Another open source JavaScript-based WYSIWYG editor that can be added to the standard edit page and to textareas defined by the Page Forms. TinyMCE is designed to be easy to use and integrate into web applications. It supports a range of formatting options and includes features like spell check and file upload. The extension includes the free core version of the TinyMCE editor.

Conclusion

VisualEditor is a flagman extension under active development. Using VisualEditor for both WYSIWIG and source edit mode is a perfect solution for users looking for a consistent and functional editor workspace. Ultimately, the best editor for you will depend on your needs and preferences.

We have an additional article with information on How To Use MediaWiki VisualEditor.