How to add new tools to your mediawiki toolbar

Lonny's picture

So you want to extend the toolbar for your mediawiki editors? I know I do. Here is how I did it:

First copy and paste the code at http://www.appropedia.org/MediaWiki:Common.js
Then edit it to match your site and needs. Here is one snippet, with descriptions, in italics, of each of the lines.

mwCustomEditButtons[mwCustomEditButtons.length EB* = { says to MW, "Hey this is gonna be a toolbar button."

  "imageFile": "http://www.appropedia.org/images/c/c8/Button_redirect.png",   this is the location of your button image - just upload as normal then find the address by clicking through.
  "speedTip": "Insert hidden Comment", This is what the tool says when the editor hovers.
  "tagOpen": "This is the first part of what gets inserted when a user clicks the tool.
  "tagClose": " -->", This is the last part of what gets inserted when a user clicks the tool.
  "sampleText": "Comment"};  This is the middle part of what gets inserted when a user clicks the tool without any text highlighted.

Note: If an editor has text highlighted when they click the tool, the tagOpen will go before and the tagClose will go after, and no sampleText will be inserted.

  • EB stands for endbracket. I was having problems with auto-formatting of brackets. I apologize for the cheezy hack.

Enjoy.

Comments

Post new comment

The content of this field is kept private and will not be shown publicly.
  • <ref>, </ref> around notes. <nowiki>, </nowiki> around text not to be formatted.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <sup> <h1> <h2> <h3> <h4> <h5> <big> <small> <img> <ref> </ref> <references> <nowiki> </nowiki>
  • Allow MediaWiki syntax (limited).
  • Images can be added to this post.
  • Handle "[[Page]]" (wikis), [http://... link text] (exts)
  • Lines and paragraphs break automatically.
  • Web page addresses and e-mail addresses turn into links automatically.
  • You may use [inline:xx] tags to display uploaded files or images inline.
  • You can use context links in the text to create context-related links to pages or sites that provide additional information about a word or phrase.

More information about formatting options

Captcha
This question is for testing whether you are a human visitor and to prevent automated spam submissions.