Kannettaviin tietolaatikoihin sisältyy laaja valikoima tunnisteita ja vaihtoehtoja, joita voit käyttää saadaksesi tietolaatikon näkymään niin kuin haluan. Alla ovat luetetuina kaikki tavalliset tunnisteet, wikitekstinäytteiden ja HTML -tulosteiden kera, auttaaksemme sinua näkemään mitä sinun tarvitsee käyttää, ja miten antaa sille CSS -muodonmuutoksen (katso myös Ohje:Tietolaatikot/CSS ). Huomaa , että jäsennysfunktioita voi myös käyttää.
Kaikki tietolaatikon kentät pitäisi määrittää käyttämällä XML -sopimuksia ja kenttäkonfigurointiin käytettyjä attribuutteja [1] .
Perustunnisteet [ ]
infobox
[ ]
Attribuutit
theme
theme-source
layout
accent-color-source
accent-color-text-source
accent-color-default
accent-color-text-default
Lapsitunnisteet
title
image
header
navigation
data
group
Tunniste, joka sisältää kaikki muut ja rajaa tietolaatikon laajuutta.
Syöte
Tuloste
<infobox>
<title source= "title_source" />
</infobox>
< aside class = "portable-infobox pi-background pi-theme-wikia pi-layout-default" >
< h2 class = "pi-item pi-item-spacing pi-title" > Title</ h2 >
</ aside >
title
[ ]
Attribuutit
Lapsitunnisteet
Määrittää tietolaatikon otsikon. title
-tunnisteissa käytetttävät kuvat eivät näy mobiiliversiossa.[2]
Syöte
Tuloste
<title source= "title_source" >
<default> {{PAGENAME}}</default>
</title>
< h2 class = "pi-item pi-item-spacing pi-title" > Sivun nimi</ h2 >
data
[ ]
Attribuutit
Lapsitunnisteet
Tavallinen avainarvotunniste.
Syöte
Tuloste
<data source= "name" >
<label> Etunimi</label>
<default> John</default>
</data>
< div class = "pi-item pi-item-spacing pi-data pi-border-color" >
< h3 class = "pi-secondary-font pi-data-label" > Etunimi</ h3 >
< div class = "pi-font pi-data-value" > John</ div >
</ div >
Tulosteen muokkaajat [ ]
label
[ ]
Attribuutit
None
Lapsitunnisteet
None
Nimiketunniste, voidaan käyttää vain muiden tunnisteiden sisällä, tarkistaa lapsitunnisteen sarakkeen lisätietojen saamiseksi. Hyväksyy wikitekstin .
Syöte
Tuloste
<label> First name</label>
< h3 class = "pi-secondary-font pi-data-label" > Etunimi</ h3 >
default
[ ]
Attribuutit
Ei ole
Lapsitunnisteet
Ei ole
Oletustunniste näyttää tekstiä vain jos on dataa, voidaan käyttää vain muiden tunnisteiden sisällä, tarkistaa lapsitunnisteiden sarakkeen lisätietojen saamiseksi. Hyväksyy wikitekstin .
Syöte
Tuloste
< div class = "pi-font pi-data-value" > John</ div >
format
[ ]
Attribuutit
Ei ole
Lapsitunnisteet
Ei ole
Muotoilutunniste, voidaan käyttää vain muiden tunnisteiden sisällä, tarkistaa lapsitunnisteiden sarakkeen lisätietojen saamiseksi. Hyväksyy wikitekstin .
Syöte
Tuloste
<data source= "dollars" >
<label> Normaalihinta</label>
<format> ${{{dollars}}}</format>
</data>
< div class = "pi-item pi-item-spacing pi-data pi-border-color" >
< h3 class = "pi-secondary-font pi-data-label" > Normaalihinta</ h3 >
< div class = "pi-font pi-data-value" > $15</ div >
</ div >
Kuvatunnisteet [ ]
image
[ ]
Attribuutit
Lapsitunnisteet
|Kuvatunniste, käytetään lisäämään kuva tietolaatikon sisään. Sen tyyliä voi mukauttaa vain käyttämällä yhteisön CSS -koodia. Useamman kuvan voi lisätä käyttämällä galleriatunnistetta .
Täällä on käytetty oletustunnistetta määrittämään mitä kuvaa käytetään, jos artikkeliin ei ole valittu kuvaa. Esimerkiksi, <default>Example.jpg</default>
.
Syöte
Tuloste
< figure class = "pi-item pi-image" >
< a href = ".../Tiedosto:Image.jpg" class = "image image-thumbnail" title = "" >
< img src = "Image.jpg" class = "pi-image-thumbnail" alt = "" width = "" height = "" data-image-key = "Image.jpg" data-image-name = "Image.jpg" >
</ a >
</ figure >
alt
[ ]
Attribuutit
Lapsitunniste
Voidaan käyttää vain kuvatunnisteen sisällä.
Syöte
Tuloste
<image source= "image" >
<alt source= "alternative_title" >
<default> Default alt text</default>
</alt>
</image>
< figure class = "pi-item pi-image" >
< a href = ".../Tiedosto:Image.jpg" class = "image image-thumbnail" title = "Default alt text" >
< img src = "Image.jpg" class = "pi-image-thumbnail" alt = "Default alt text" width = "" height = "" data-image-key = "Image.jpg" data-image-name = "Image.jpg" >
</ a >
</ figure >
caption
[ ]
Attribuutit
Lapsitunnisteet
Voidaan käyttää vain kuvatunnisteen sisällä.
Syöte
Tunniste
<image source= "image" >
<caption source= "caption" >
<default> Kuvatekstini</default>
</caption>
</image>
< figcaption class = "pi-item-spacing pi-caption" > Kuvatekstini</ figcaption >
Muut tunnisteet [ ]
group
[ ]
Attribuutit
layout
show
collapse
row-items
Lapsitunnisteet
data
header
image
title
navigation
Käytetään kenttien ryhmitykseen, voi antamaan otsikon jokaiselle ryhmälle. Ryhmää ei rendeerata (edes otsikkoa), jos kaikki kentät ovat tyhjiä. Kuitenkin, jos käytössä on attribuutti "show=incomplete", se näyttää kaikki ryhmän kentät, jos vähintään yksi kenttä ei ole tyhjä.
Oletusryhmä [ ]
Syöte
Tuloste
<group>
<header> Ryhmän nimi</header>
<data source= "value1" />
</group>
< section class = "pi-item pi-group pi-border-color" >
< h2 class = "pi-item pi-secondary-font pi-item-spacing pi-secondary-background pi-header" > Group name</ h2 >
< div class = "pi-item pi-item-spacing pi-data pi-border-color" >
< div class = "pi-font pi-data-value" > Data value</ div >
</ div >
</ section >
Vaakasuora ryhmä [ ]
Syöte
Tuloste
<group layout= "horizontal" >
<header> Ryhmän nimi</header>
<data source= "value1" >
<label> Tietonimike</label>
</data>
</group>
< section class = "pi-item pi-group pi-border-color" >
< table class = "pi-horizontal-group" >
< caption class = "pi-secondary-font pi-secondary-background pi-item-spacing pi-header" > Ryhmän nimi</ caption >
< thead >
< tr >
< th class = "pi-secondary-font pi-horizontal-group-item pi-data-label pi-border-color pi-item-spacing" > Tietonimike</ th >
</ tr >
</ thead >
< tbody >
< tr >
< td class = "pi-font pi-horizontal-group-item pi-data-value pi-border-color pi-item-spacing" > Data value</ td >
</ tr >
</ tbody >
</ table >
</ section >
Älykäs ryhmä [ ]
Syöte
Tuloste
<group row-items= "3" >
<header> Otsikkoteksti</header>
<data source= "row3" >
<label> Tietonimike</label>
</data>
<data source= "row4" >
<label> Tietonimike </label>
</data>
<data source= "row5" >
<label> Tietonimike </label>
</data>
<data source= "row6" >
<label> Tietonimike </label>
</data>
<data source= "row7" >
<label> Tietonimike </label>
</data>
<data source= "row8" layout= "default" >
<label> Tietonimike </label>
</data>
<data source= "row9" layout= "default" >
<label> Tietonimike </label>
</data>
</group>
< section class = "pi-item pi-group pi-border-color" >< h2 class = "pi-item pi-header pi-secondary-font pi-item-spacing pi-secondary-background" > Section Header</ h2 >
< section class = "pi-item pi-smart-group pi-border-color" >
< section class = "pi-smart-group-head" >
< h3 class = "pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style = "width: calc(1 / 3 * 100%);" > Tietonimike </ h3 >
< h3 class = "pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style = "width: calc(1 / 3 * 100%);" > Tietonimike </ h3 >
< h3 class = "pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style = "width: calc(1 / 3 * 100%);" > Tietonimike </ h3 >
</ section >
< section class = "pi-smart-group-body" >
< div class = "pi-smart-data-value pi-data-value pi-font pi-item-spacing" style = "width: calc(1 / 3 * 100%);" > CCC</ div >
< div class = "pi-smart-data-value pi-data-value pi-font pi-item-spacing" style = "width: calc(1 / 3 * 100%);" > DDD</ div >
< div class = "pi-smart-data-value pi-data-value pi-font pi-item-spacing" style = "width: calc(1 / 3 * 100%);" > EEE</ div >
</ section >
</ section >
< section class = "pi-item pi-smart-group pi-border-color" >
< section class = "pi-smart-group-head" >
< h3 class = "pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style = "width: calc(1 / 2 * 100%);" > Tietonimike </ h3 >
< h3 class = "pi-smart-data-label pi-data-label pi-secondary-font pi-item-spacing" style = "width: calc(1 / 2 * 100%);" > Tietonimike </ h3 >
</ section >
< section class = "pi-smart-group-body" >
< div class = "pi-smart-data-value pi-data-value pi-font pi-item-spacing" style = "width: calc(1 / 2 * 100%);" > FFF</ div >
< div class = "pi-smart-data-value pi-data-value pi-font pi-item-spacing" style = "width: calc(1 / 2 * 100%);" > GGG</ div >
</ section >
</ section >
< div class = "pi-item pi-data pi-item-spacing pi-border-color" >
< h3 class = "pi-data-label pi-secondary-font" > Tietonimike </ h3 >
< div class = "pi-data-value pi-font" > HHH</ div >
</ div >
< div class = "pi-item pi-data pi-item-spacing pi-border-color" >
< h3 class = "pi-data-label pi-secondary-font" > Tietonimike </ h3 >
< div class = "pi-data-value pi-font" > III</ div >
</ div >
</ section >
[ ]
Attribuutit
Ei ole
Lapsitunnisteet
Ei ole
Otsikkotunniste merkitsee tunnisteryhmän tai -osion alkua.
Input
Output
<header> Otsikkoteksti</header>
Oletusryhmä
< h2 class = "pi-item pi-secondary-font pi-item-spacing pi-secondary-background pi-header" > Otsikkoteksti</ h2 >
Vaakasuora ryhmä
< caption class = "pi-secondary-font pi-secondary-background pi-item-spacing pi-header" > Otsikkoteksti</ caption >
navigation
[ ]
Attribuutit
None
Lapsitunnisteet
None
Käytetään minkä tahansa wikitekstin toimittamiseen.
Syöte
Tunniste
<navigation> [[Linkki]]</navigation>
< nav class = "pi-item-spacing pi-secondary-background pi-secondary-font pi-navigation" >
< a href = "/wiki/Link" title = "Link" > Link</ a >
</ nav >
Viitteet [ ]