Help: Buttons: verschil tussen versies
Uit MediaWikiGids
(Vertaald in Nederlands) |
k (→Parsing) |
||
(5 tussenliggende versies door dezelfde gebruiker niet weergegeven) | |||
Regel 23: | Regel 23: | ||
| | | | ||
<div class="btn-toolbar"><btn size="lg">Grote Knop</btn> | <div class="btn-toolbar"><btn size="lg">Grote Knop</btn> | ||
− | <btn size="sm"> | + | <btn size="sm">Kleine Knop</btn> |
<btn size="xs">Mini Knop</btn></div> | <btn size="xs">Mini Knop</btn></div> | ||
|- | |- | ||
Regel 59: | Regel 59: | ||
<pre> | <pre> | ||
<btn class="btn-primary"> | <btn class="btn-primary"> | ||
− | Knoppen met klasse | + | Knoppen |
+ | met klasse | ||
</btn> | </btn> | ||
</pre> | </pre> | ||
Regel 162: | Regel 163: | ||
<btn> | <btn> | ||
Semantische Dropdown | Semantische Dropdown | ||
− | * {{#ask:[[ | + | * {{#ask:[[Categorie:Tweeki Componenten]]}} |
</btn> | </btn> | ||
</pre> | </pre> | ||
Regel 168: | Regel 169: | ||
<btn> | <btn> | ||
Semantische Dropdown | Semantische Dropdown | ||
− | * {{#ask:[[ | + | * {{#ask:[[Categorie:Tweeki Componenten]]}} |
</btn> | </btn> | ||
|} | |} | ||
Regel 260: | Regel 261: | ||
|} | |} | ||
− | == | + | == Iconen == |
{| class="table table-bordered" | {| class="table table-bordered" | ||
− | ! | + | ! Codering !! Resultaat |
|- | |- | ||
| | | | ||
<pre> | <pre> | ||
<btn> | <btn> | ||
− | Target|<span class="glyphicon glyphicon-cog"></span> | + | Target|<span class="glyphicon glyphicon-cog"></span> icoon met span |
</btn> | </btn> | ||
</pre> | </pre> | ||
| | | | ||
<btn> | <btn> | ||
− | Target|<span class="glyphicon glyphicon-cog"></span> | + | Target|<span class="glyphicon glyphicon-cog"></span> icoon met span |
</btn> | </btn> | ||
|- | |- | ||
Regel 282: | Regel 283: | ||
</btn> | </btn> | ||
</pre> | </pre> | ||
− | <small>''' | + | <small>'''NB:''' het ''icon'' attribuut is gewoon een synoniem voor 'glyphicon' |
| | | | ||
<btn icon="cog"> | <btn icon="cog"> | ||
Regel 302: | Regel 303: | ||
<pre> | <pre> | ||
<btn fa="cog"> | <btn fa="cog"> | ||
− | fa | + | fa attribuut |
</btn> | </btn> | ||
</pre> | </pre> | ||
| | | | ||
<btn fa="cog"> | <btn fa="cog"> | ||
− | fa | + | fa attribuut |
</btn> | </btn> | ||
|} | |} | ||
Regel 318: | Regel 319: | ||
<pre> | <pre> | ||
<btn> | <btn> | ||
− | {{fullurl:{{ | + | {{fullurl:{{FULLPAGENAME}}}}|{{ucfirst:magic words}} |
</btn> | </btn> | ||
</pre> | </pre> | ||
| | | | ||
<btn> | <btn> | ||
− | {{fullurl:{{ | + | {{fullurl:{{FULLPAGENAME}}}}|{{ucfirst:magic words}} |
</btn> | </btn> | ||
|- | |- | ||
Regel 339: | Regel 340: | ||
|} | |} | ||
− | == | + | == Overige mogelijkheden == |
{| class="table table-bordered" | {| class="table table-bordered" |
Huidige versie van 20 mrt 2017 om 20:28
Met de Tweeki-skin is het erg gemakkelijk om iedere gewenste knop ('button') te maken. Door het gebruik van slimme standaardwaarden is de benodigde codering zeer beknopt.
Pas op: Deze functionaliteit omzeilt de standaard behandeling van koppelingen ('links') door MediaWiki-software. Dit heeft mogelijk gevolgen voor de veiligheid van de website. Het is dus raadzaam alleen vertrouwde mensen tekst in de wiki te laten bewerken. Ook werken functie als 'koppelingen binnen de website' ('Links to this site') niet voor knop-koppelingen.
Inhoud
Standaard knoppen
Code | Resultaat |
---|---|
<btn>Eenvoudige Knop</btn> |
|
<btn size="lg">Grote Knop</btn> <btn size="sm">Kleine Knop</btn> <btn size="xs">Mini Knop</btn> |
|
<btn> Gegroepeerde Knoppen </btn> |
|
<btn> Knop Tool Bar </btn> |
|
<btn class="btn-primary"> Knoppen met klasse </btn> |
|
<btn class=""> Knop zonder klasse </btn> |
|
<btn> Met Klasse||btn-primary Zonder Klasse Veel Klasse||btn-success </btn> |
|
<btn> Standaard Knop Een Pagina Naam|Interne Doelpagina http://erge.ns|Externe Doelpagina </btn> |
Dropdown Knoppen
Codering | Resultaat |
---|---|
<btn> Dropdown-Menu * Een Menu Item * * Nog Een Menu Item </btn> |
|
<btn> Doel|Gesplitste Dropdown * Een Menu Item </btn> |
|
<btn class=""> Dropdown zonder Knop * Een Menu Item </btn> |
|
<btn> Semantische Dropdown * {{#ask:[[Categorie:Tweeki Componenten]]}} </btn> |
Wrappers
Markup | Result |
---|---|
<btn wrapperclass="btn-group dropup"> Dropup * Een Menu Item </btn> |
|
<btn wrapperclass="btn-group-vertical"> Explicit Wrapper Setting </btn> |
|
<btn wrapper=""> Explicit Wrapper Unsetting </btn> |
Styling
Codering | Resultaat |
---|---|
<btn> Target|<i>Italic Tag</i> </btn> |
|
<btn> Target|''Italic Wiki Markup'' </btn> |
|
''<btn> Surrounding Italic Wiki Markup </btn>'' |
Iconen
Codering | Resultaat |
---|---|
<btn> Target|<span class="glyphicon glyphicon-cog"></span> icoon met span </btn> |
|
<btn icon="cog"> icon attribute </btn> NB: het icon attribuut is gewoon een synoniem voor 'glyphicon' |
|
<btn glyphicon="cog"> glyphicon attribute </btn> |
|
<btn fa="cog"> fa attribuut </btn> |
Parsing
Markup | Result |
---|---|
<btn> {{fullurl:{{FULLPAGENAME}}}}|{{ucfirst:magic words}} </btn> |
|
<btn> mainpage </btn> Info: if a system message by that name exists, the text will be replaced by it's content |
Overige mogelijkheden
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> Attentie! Zorg ervoor dat je niet de |
Specificaties
De algemene structuur van de de codering voor een enkele knop is target|text|class
, waarin text
en class
optioneel zijn. Wanneer text
wordt weggelaten, dan wordt er van uit gegaan dat deze hetzelfde is als target
. target
en text
worden verwerkt volgens het onderstaande algoritme.
- Check of er een semantische querie staat.
- Wanneer er een bestaande of standaard interface message bestaat met die naam, gebruik dan de inhoud van dat bericht.
- Verwerk het.
- Wanneer het een geldige URL betreft (beginning with http:// or other URL protocol), the link will point to that URL.
- Indien geen van bovenstaanden, dan wordt het verwerkt als een wikilink.