This page is
outdated.
The classic/"old-style" toolbar present in MediaWiki core was removed from core in MediaWiki 1.32 (see commit cfa70ea6d003ae69d52aad67a543912449c71e00 and phab:T30856 & phab:T32795).
If you have checked or updated this page and found the content to be suitable, please remove this notice. See the talk page for a possible discussion on this. (16 October 2023)
You can add custom edit buttons to the edit toolbar above the edit window using JavaScript (see below). You have to differentiate between the new toolbar added by Extension:WikiEditor and the old one (also known as classic edit toolbar).
mw.user.options.get( 'usebetatoolbar' ) can be used to check if a user is using the wikiEditor (true) or the old toolbar (false).
Custom buttons utilize JavaScript to implement their functionality. To get the JavaScript to activate on the edit page, there are multiple ways to apply JavaScript to the wiki edit page:
To add new buttons you can include them in your personal JavaScript.
In LocalSettings.php add $wgAllowUserJs = true; or in the MediaWiki:Common.js or as a Gadget.
Extension JavaScript[edit]After the setup of the basic extension structure, the core PHP file will need to hold (or indirectly referenced, in complex extensions), the first two steps below. For a simple extension, like one intending only to add the custom button, the third step could occur in the core extension PHP file, as in this simple sample, or could be in another PHP file. There could also be localization needs, which would be included in the i18n file.
Define Resource Loader bundle[edit]The best practice for extensions is exploitation of the Resource Loader API, which provides performance optimization as well as a standard way of accessing scripts. This simple example shows the addition of one JavaScript file.
$wgResourceModules['ext.MyExtension']['scripts'][] = 'extensions/MyExtension/js/MyExtension.js';
One of the hooks offered by the Edit page allows addition of a function reference. The function or method referenced here can be in the main PHP file for the extension if it is a simple extension or in another PHP file.
$wgHooks['EditPage::showEditForm:initial'][] = 'addModule';
The edit page hook allows addition of a reference to the Resource Loader module defined earlier. This example shows adding to every page. There could be complex logic associated with when to display and further conditions would be added in this handler. The argument to the addModules method is the same string as defined in the step defining the bundle.
function addModule(EditPage $editPage, OutputPage $output ) {
$output->addModules( 'ext.MyExtension' );
}
With these three steps completed, the JavaScript file referenced in the resource bundle should be applied to every edit page. The API allows for multiple files and more fine grained control of when the file is called.
The design criteria for additions to the core of MediaWiki exceed what are mentioned here, but the mechanics for adding buttons are described.
JavaScript files for core MediaWiki are referenced in the 'resources/Resources.php' file. The default bundle for the edit page includes 'resources/src/mediawiki.action/mediawiki.action.edit.js'. If the button should be displayed every time, this JavaScript file should be enhanced with the new button. If the button has conditions that the JavaScript file should not be loaded every time, steps similar to an extension should be executed and consideration should be give to whether the function belongs in the core of MediaWiki source code or whether an extension is the right tool to deliver the enhancement.
jQuery( document ).ready( function ( $ ) {
$( '#wpTextbox1' ).wikiEditor( 'addToToolbar', {
section: 'advanced',
group: 'format',
tools: {
buttonId: {
label: 'Comment visible only for editors',
type: 'button',
icon: '//upload.wikimedia.org/wikipedia/commons/f/f9/Toolbaricon_regular_S_stroke.png',
action: {
type: 'encapsulate',
options: {
pre: '<!-- ',
peri: 'Insert comment here',
post: ' -->'
}
}
}
}
} );
} );
See also Toolbar customization for more advanced options and examples.
You may also use the InsertWikiEditorButton script (by user Krinkle) to simplify adding buttons to the wikiEditor.
mw.hook( 'wikipage.editform' ).add( function () {
mw.loader.using( 'mediawiki.toolbar' ).then( function () {
mw.toolbar.addButton( {
imageFile: '//upload.wikimedia.org/wikipedia/en/3/34/Button_hide_comment.png',
speedTip: 'Comment visible only for editors',
tagOpen: '<!-- ',
tagClose: ' -->',
sampleText: 'Insert comment here',
imageId: 'button-comment'
} );
} );
} );
<!---->RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4