Help:Custom edit buttons
Wikia - creating communities
| |
Custom edit buttons can be added to the edit toolbar which displays above the edit box if you have Javascript enabled. These buttons serve a similar function to the CharInsert extension, allowing special characters or chunks of text to be inserted into the edit box.
This toolbar might not appear if you have selected "Use in-page editor" in your preferences (this is enabled by default for new accounts), or if you have deselected "Show edit toolbar (JavaScript)".
You may add custom buttons in user/monaco.js so that only you can see and use them, or you may add them to MediaWiki:Common.js to make them available to all users on your Wikia.
How do I create and upload button images?
The first thing to do is create a 23x22 image in any image editing program (you can use Image:Button_blank.png as a template). Then upload it as you would any other image.
Note: If your image serves a function that other Wikia may find useful, please upload the image to Central Wikia (and be sure to tag it with [[Category:Custom edit buttons]].). Because all uploaded images are served from images.wikia.com anyway, you might as well put them at Central where others can find and use them. That way, your good ideas will spread and there is no need for others to duplicate your efforts. You can view the category of already uploaded ones at , see the category w:Category:Custom edit buttons
How do I edit the Javascript file?
Find the correct Javascript (.js) file. Your personal js will be located at http://WIKINAME.wikia.com/wiki/User:USERNAME/monaco.js (if you use the Monaco skin), while the sitewide js will be located at http://WIKINAME.wikia.com/wiki/MediaWiki:Common.js. If you like to have buttons common to all wikis, place the code in http://www.wikia.com/wiki/User:''USERNAME''/global.js
Simply edit the file to add a new section to the mwCustomEditButtons array. You will add one section to the array for each custom button you wish to add.
if (mwCustomEditButtons) {
mwCustomEditButtons[mwCustomEditButtons.length] = {
"imageFile": "http://images.wikia.com/central/images/c/c8/Button_redirect.png",
"speedTip": "Redirect",
"tagOpen": "#REDIRECT [[",
"tagClose": "]]",
"sampleText": "Insert text"};
mwCustomEditButtons[mwCustomEditButtons.length] = {
"imageFile": "http://images.wikia.com/central/images/c/c9/Button_strike.png",
"speedTip": "Strike",
"tagOpen": "<s>",
"tagClose": "</s>",
"sampleText": "Strike-through text"};
mwCustomEditButtons[mwCustomEditButtons.length] = {
"imageFile": "http://images.wikia.com/central/images/1/13/Button_enter.png",
"speedTip": "Line break",
"tagOpen": "<br />",
"tagClose": "",
"sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
"imageFile": "http://images.wikia.com/central/images/7/74/Button_comment.png",
"speedTip": "Comment visible only for editors",
"tagOpen": "<!-- ",
"tagClose": " -->",
"sampleText": "Insert comment here"}
}
- imageFile : is the full URL to the image.
- You may find the full URL to the image by going to the image description page and clicking the hyperlink below the image to see the full-size image. Use the URL from the resulting image-only page.
- The image must be stored on your local Wikia or on the Central Wikia -- it must use a Wikia.com URL.
- speedTip : the tool-tip text (shown when you hover the mouse over the button).
- tagOpen : the opening tag
- tagClose : the closing tag (omitted if there is no sample text needed).
- sampleText : the text that will be automatically highlighted upon insertion (between the two other tags), this is intended to be replaced by user input.
Once saved, the .js file will be parsed when an edit page is loaded, and your custom buttons will appear.
See also
Available uploaded images here:
Some available image repositories (copy and upload here as needed):
More examples at: