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.

Caveat: 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.

Standard Buttons

Markup	Result
<btn>Simple Button</btn>	Simple Button
<btn size="large">Large Button</btn> <btn size="small">Small Button</btn> <btn size="mini">Mini Button</btn>	Large Button Small Button Mini Button
<btn> Grouped Buttons </btn>	GroupedButtons
<btn> Button Tool Bar </btn>	Button ToolBar
<btn class="btn-primary"> Classy Buttons </btn>	ClassyButtons
<btn> Classy||btn-primary Non-classy Very Classy||btn-success </btn>	ClassyNon-classyVery Classy
<btn> Standard Button Some Page Title|Internal Target http://some.where|External Target </btn>	Standard ButtonInternal TargetExternal Target

Dropdown Buttons

Markup	Result
<btn> Dropdown-Menu * Some Menu Item ** Submenu * * Some Other Menu Item </btn>	Dropdown-Menu Some Menu ItemSubmenu Some Other Menu Item
<btn> Target|Split Dropdown * Some Menu Item </btn>	Split DropdownToggle Dropdown Some Menu Item
<btn class=""> Non-Button Dropdown * Some Menu Item </btn>	Non-Button Dropdown Some Menu Item
<btn> Semantic Dropdown * {{#ask:[[Category:Components]]}} </btn>	Semantic Dropdown AccordionsButtonsCarouselFormsModalsNavigationTabsTooltips

Wrappers

Markup	Result
<btn wrapperclass="btn-group dropup"> Dropup * Some Menu Item </btn>	Dropup Some Menu Item
<btn wrapperclass="btn-group-vertical"> Explicit Wrapper Setting </btn>	ExplicitWrapperSetting
<btn wrapper=""> Explicit Wrapper Unsetting </btn>	ExplicitWrapperUnsetting

Styling

Markup	Result
<btn> Target|<i>Italic Tag</i> </btn>	Italic Tag
<btn> Target|''Italic Wiki Markup'' </btn>	Italic Wiki Markup
''<btn> Surrounding Italic Wiki Markup </btn>''	Surrounding Italic Wiki Markup

Icons

Markup	Result
<btn> Target|<span class="glyphicon glyphicon-cog"></span> icon with span </btn>	icon with span
<btn icon="cog"> icon attribute </btn> Note: the icon attribute is just a synonym for 'glyphicon'	icon attribute
<btn glyphicon="cog"> glyphicon attribute </btn>	glyphicon attribute
<btn fa="cog"> fa attribute </btn>	fa attribute

Parsing

Markup	Result
<btn> {{fullurl:{{PAGENAME}}}}|{{ucfirst:magic words}} </btn>	Magic words

Miscellaneous

Markup	Result
<div class="dropdown"> <btn data-toggle="dropdown"> Data-Toggle-Attribut <b class="caret"></b> </btn><ul class="dropdown-menu" id="file-dropdown-menu"> <li>[[Buttons]]</li> <li class="divider"></li> <li>[[Test]]</li> </ul> </div> Attention! Be careful not to have the ul on a new line!	Data-Toggle-Attribut Buttons Test

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. Check for semantic queries.
2. If there is an existing or default interface message with that name, use the content of that message instead.
3. Parse it.
4. If it is a valid URL (beginning with http:// or other URL protocol), the link will point to that URL.
5. Else, it will be treated as a wikilink.