Buttons

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 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 Some Menu Item Submenu Some Other Menu Item </button>
<button> Split Dropdown|Target * Some Menu Item </button>	<button> Split Dropdown|Target Some Menu Item </button>
<button class=""> Non-Button Dropdown * Some Menu Item </button>	<button class=""> Non-Button Dropdown Some Menu Item </button>
<button> Semantic Dropdown * {{#ask:[[Category:Components]]}} </button>	<button> Semantic Dropdown Accordions, Buttons, Carousel, Forms, Modals, Navigation, Tabs, Tooltips </button>

Wrappers

Markup	Result
<button wrapperclass="btn-group dropup"> Dropup * Some Menu Item </button>	<button wrapperclass="btn-group dropup"> Dropup Some Menu Item </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.

1. If there is an existing or default interface message with that name, use the content of that message instead.
2. Parse it.
3. If it is a valid URL (beginning with http:// or other URL protocol), the link will point to that URL.
4. Else, it will be treated as a wikilink.