Difference between revisions of "User:King of Herdaz/Toolbar customization"

m
* To add a one line comment put <code>//</code> at the beginning of a line followed by the text of the comment. Whatever you write after a <code>//</code> on that line will not affect your code.
* For multi line comments put your comments between <code>/*</code> and <code>*/</code>.
* Code for your toolbar must have the exact correct number of curly brackets (<code>{</code>), square brackets (<code>[</code>), apostrophes (<code>'</code>), parentheses (<code>(</code>), and commas (<code>,</code>) to work. If your toolbar breaks after you changed something check to see if you missed or added an extra one of these.
* While not strictly necessary, it is a good idea to split code in your toolbar over multiple lines and with whitespace differentiating each "level" of the toolbar in a manner similar to how it is done in the examples on this page. This will help you keep track of the different parts of your code and will help you keep track of the number of open and closed curly brackets in your code.
 
==== Strings ====
A string is a piece of text within the toolbar. Strings used in labels and actions should follow the following guidelines:
* Inserting <code>' + '</code> between two parts of a string can have effects on your [[Special:MyPage/common.js|common.js]] page (as will be discussed below), but will not appear on a page when the action is called, or be included in the label(s) on the actual toolbar. For example, both <code><nowiki><br />{{stub}}</nowiki></code> and <code><nowiki><{' + 'br />{stub}}</nowiki></code> will produce the same result (<code><nowiki><br />{{stub}}</nowiki></code>) on the page when they are called.
* When writing out templates, whether for a label or an action, you must insert <code>' + '</code> between the first two curly brackets. For example, instead of writing <code><nowiki>{{Stormlight}}</nowiki></code> you should write <code><nowiki>{' + '{Stormlight}}</nowiki></code>. This prevents the template from applying categories to your [[Special:MyPage/common.js|common.js]] page and also prevents it from being listed on the relevant template's list of pages that use it.
* For the same reason you must also do this when writing category tags. For example, instead of writing <code><nowiki>[[Category: Stormlight]]</nowiki></code> you should write <code><nowiki>[' + '[Category: Stormlight]]</nowiki></code>.
* When writing code for substitutions this is even more important, since if you do not do it then the substitution will be performed when you save your [[Special:MyPage/common.js|common.js]] page. For example, instead of writing <code><nowiki>{{SUBST:PAGENAME}}</nowiki></code> you should write <code><nowiki>{' + '{SUBST:PAGENAME}}</nowiki></code>.
 
==== DefinitionsInternal Names ====
;Internal Names:
Many things in the toolbar must be given internal names. Internal names help the program differentiate between different parts of the toolbar. What you use as an internal name will not affect the toolbar so you can use any string of characters.
 
Internal names must not contain any spaces. If you want an internal name to be more than one word you can use a dash (<code>-</code>) instead of a space. You should not reuse internal names within your entire toolbar. If you use the same internal name multiplemore timesthan once then either strange things will happen or the toolbar will simply break.
 
;==== Labels: ====
A label is the name of an element that will be displayed on the toolbar. For dropdowns these are displayed in the dropdown itself, while with buttons the label is shown when you hover your cursor over the icon for the button. Unlike internal names theselabels can be reused.
 
{{anchor|action}}{{anchor|actions}}
==== Actions ====
While there are other types of actions that you can do, in this guide we focus on the <code>encapsulate</code> action as it is the easiest to understand and use. This action pastes one snippet of textstring before the highlighted text (or you cursor) and a second snippetstring after the highlighted text. The second snippetstring (after <code>post:</code>) is optional and can be deleted if you only want to insert one string of text.
 
The code for this action is as follows, and this format is the same for dropdowns, booklets and buttons.
<code>XXXX</code> is replaced by the string that goes before the highlighted text/cursor, and <code>YYYY</code> is replaced by the string that goes after the highlighted text/cursor.
 
* To have an action include a line break insert <code>\n</code> into the snippetstring at the place you want it to be. For stylistic reasons some people will put <code>' + '</code> between instances of <code>\n</code> and other text in their snippetsstrings, but this does not have any effect on the output of the action and can be omitted if you want.
* To have an action include an apostrophe (<code>'</code>) within the string that it inserts, place <code>\'</code> into your code at the place you want the apostrophe to go. If you do not include the backslash (<code>\</code>) and type additional apostrophes in your code it will cause the toolbar to break. You must put an additional backslash with each additional apostrophe you add to a string.
 
=== Creating Your Own Buttons ===
Autopatrolled, Editors
8,718

edits