Difference between revisions of "Buttons"
Line 1: | Line 1: | ||
[[Category:Components]] __FORCETOC__ | [[Category:Components]] __FORCETOC__ | ||
With tweeki it is very easy to create any button you would like to have. By using smart defaults the markup can be very reduced. | With tweeki it is very easy to create any button you would like to have. By using smart defaults the markup can be very reduced. | ||
+ | |||
+ | <div class="alert alert-info" role="alert">This feature bypasses MediaWiki's default link handling. This might have security implications. You should only allow editing to people you trust! Also features like 'Links to this site' will not work for button links.</div> | ||
+ | |||
== Standard Buttons == | == Standard Buttons == | ||
{| class=wikitable | {| class=wikitable |
Revision as of 20:09, 16 February 2015
With tweeki it is very easy to create any button you would like to have. By using smart defaults the markup can be very reduced.
Standard Buttons
Markup | Result |
---|---|
<button>Simple Button</button> |
<button>Simple Button</button> |
<button size="large">Large Button</button> <button size="small">Small Button</button> <button size="mini">Mini Button</button> |
|
<button> Grouped Buttons </button> |
<button> Grouped Buttons </button> |
<button> Button Tool Bar </button> |
<button> Button Tool Bar </button> |
<button class="btn-primary"> Classy Buttons </button> |
<button class="btn-primary"> Classy Buttons </button> |
<button> Classy||btn-primary Non-classy Very Classy||btn-success </button> |
<button> Classy||btn-primary Non-classy Very Classy||btn-success </button> |
<button> Standard Button Internal Target|Some Page Title External Target|http://some.where </button> |
<button> Standard Button Internal Target|Some Page Title External Target|http://some.where </button> |
Dropdown Buttons
Markup | Result |
---|---|
<button> Dropdown-Menu * Some Menu Item ** Submenu * * Some Other Menu Item </button> |
<button> Dropdown-Menu
</button> |
<button> Split Dropdown|Target * Some Menu Item </button> |
<button> Split Dropdown|Target
</button> |
<button class=""> Non-Button Dropdown * Some Menu Item </button> |
<button class=""> Non-Button Dropdown
</button> |
<button> Semantic Dropdown * {{#ask:[[Category:Components]]}} </button> |
<button> Semantic Dropdown </button> |
Wrappers
Markup | Result |
---|---|
<button wrapperclass="btn-group dropup"> Dropup * Some Menu Item </button> |
<button wrapperclass="btn-group dropup"> Dropup
</button> |
<button wrapperclass="btn-group btn-group-vertical"> Explicit Wrapper Setting </button> |
<button wrapperclass="btn-group btn-group-vertical"> Explicit Wrapper Setting </button> |
<button wrapper=""> Explicit Wrapper Unsetting </button> |
<button wrapper=""> Explicit Wrapper Unsetting </button> |
Specifications
The general structure for the code of a single button is target|text|class
, where text
and class
are optional. If text
is omitted it is assumed to be the same as target
. target
and text
are parsed after the following algorithm.
- Check for semantic queries.
- If there is an existing or default interface message with that name, use the content of that message instead.
- Parse it.
- If it is a valid URL (beginning with http:// or other URL protocol), the link will point to that URL.
- Else, it will be treated as a wikilink.