FANDOM


90210-infobox-light.png

Näyte tietolaatikosta

Tietolaatikko on suunniteltu faktojen esittämiseksi ja on eräänlainen tiivistelmä sivun aiheesta. Se esittelee tärkeimmät aiheeseen liittyvät asiat järjestellyssä ja nopeasti luettavassa muodossa. Jotta wiki olisi yhtenäinen, tietolaatikossa käytettävät osiot ovat artikkelista toiseen yleensä samat. Tietolaatikkoja luodaan mallineiden avulla.

Wikia on kehittänyt uuden tavan tietolaatikoiden koodaamiseksi, kannettavat tietolaatikot, jotka sallivat niiden ajamisen eri laitteilla, mistä tämä antaa lisää yksityiskohtia. Tämä ei muuta sitä miten voit käyttää tietolaatikkoa artikkelissa - sen sijaan muutoksen on kokenut tapa, jolla on se on kirjoitettu maallinesivulle. On myös luotu työkalu auttamaan jo valmiiksi olemassa olevien tietolaatikoiden muuttamiseen - lisätietoa tästä löytyy sivulta Ohje:Tietolaatikon muuntaminen.

Hyödyllisiä linkkejä


Kuinka lisätä tietolaatikko artikkeliin Muokkaa

VE-portableinfobox.png

Kannettavan tietolaatikon lisääminen visuaalisella muokkaimella

Voit lisätä tietolaatikon artikkeliin samalla tavalla kuin minkä tahansa mallineen - joko muokkaajan sisäänrakennetuilla työkaluilla, tai muokkaimen lähdekoodimuodon kautta. Visuaalisella muokkaimella, kannettavat tietolaatikot voi nopeasti lisätä valitsemalla tietolaatikon 'Lisää ominaisuuksia ja media'-valikosta.

Lähdekoodimuodossa voit aloittaa kopioimalla pohjakoodin mallinen dokumentaatiosta (normaalisti se löytyy mallineen sivun alaosasta) ja liittämällä sen artikkeliin, muuttamalla yhtäsuuruusmerkin jälkeen tulevia sanoja halutuksi tiedoksi. Esimerkiksi:

{{Hahmo
 | nimi          = Päivänkakkara
 | kuva          = Esimerkki.jpg
 | kuvateksti    = Päivänkakkara, heiluu tuulessa
 | asema         = Ylin kukka
 | ikä           = 2 kuukautta
 | status        = Aktiivinen
 | korkeus       = 5 tuumaa
 | paino         = 20 grammaa
}}

Kannettavilla tietolaatikoilla, tämä toimii samalla tavalla kuin mikä tahansa muu malline. Mallinesivun marginaali on kuitenkin hieman erilainen kuten alla kuvaillaan.

Uuden tietolaatikon luominen Muokkaa

Tutorialinfobox.png

Talvi on tulossa...

Ensiksi, aloita uusi malline haluamallasi nimellä, esimeriksi Malline:Esimerkki. Menneisyydessä sinun tarvitsi käyttää taulukoita ja osioita, mutta nyt käytämme tietolaatikkotunnisteita. Aloitamme normaalilla pinotulla tietolaatikolla, nimen ja kuvan kera:

<infobox layout="stacked">
  <title source="name"><default>{{PAGENAME}}</default></title>
  <image source="image" />
</infobox>

Tämä wikiteksti neuvoo mallinettasi käyttämään muuttujia name ja image elementteille nimi ja kuva. Lisäksi voit asettaa oletustunnisteen, jonka arvoa käytetään, kun käyttäjä ei tarkemmin artikkeliin nimeä/kuvaa/jne.

Nyt tarvitsemme vain kaksi ylimääräistä kenttää lisätietoja varten, joten lisätään yksi:

<data source="season"><label>Season(s)</label></data>

Lisättyäsi viimeisen kentän lähdekoodin parametrille first ja nimikkeeksi First seen, saamme seuraavanlaisen tuloksen:

<infobox layout="stacked">
  <title source="name"><default>{{PAGENAME}}</default></title>
  <image source="image" />
  <data source="season"><label>Season(s)</label></data>
  <data source="first"><label>First seen</label></data>
</infobox>

Nyt voimme käyttää mallinetta artikkelissa, lisäämällä seuraavat parametrit saamme toimivan tietolaatikon:

{{Example
 |name   = Eddard Stark
 |image  = eddard.jpg
 |season = [[Season 1|1]]
 |first  = "[[Winter is Coming]]"
}}

Arvojen piilottaminen Muokkaa

Jokainen kenttä tai elementti ilman arvoa piilotetaan automaattisesti. Tämä pätee kaikkiin tunnisteisiin, paitsi ryhmiin, jotka näytetään väkisin (lue #Pakota kaikki ryhmäelementit näkyviin). Kun kaikki elementit ovat tyhjiä, tietolaatikko itse ei näy.

Tietolaatikon rakenteen muuttaminen Muokkaa

Tämän kaltaisilla tietolaatikoilla on automaattisesti asetettu tyyli, joka ottaa vaikutteita yhteisösi mukautetusta teemasta. Jos yhdenkin muuttujan arvo on tyhjä, kyseistä riviä mallineesta ei näytetä sivulla (ellei käytössä ole 'default'-tunniste).

RakennevaihtoehdotMuokkaa

Kaksi rakennevaihtoehtoa on saatavilla tietolaatikoille:

Oletus (taulukko) rakenne Pinottu rakenne
Nimikkeet ajetaan arvojen vasemmalta puolella Nimikkeet ajetaan arvojen yläpuolella
<infobox>
   ...
</infobox>
<infobox layout="stacked">
   ...
</infobox>
Screen Shot 2015-06-16 at 12.12.17.png

Oletusrakenne (taulukko)

Screen Shot 2015-06-16 at 12.10.54.png

"Pinottu" rakenne

Mukautettu teemaMuokkaa

Tietolaatikon oletusteema voidaan kirjata yli kahdella tavalla. Yhteisösi sivulla Toiminnot:WikiFeatures on muuttuja nimeltä Europa Infobox Theme. Jos otat sen käyttöön, tietolaatikkosi ottaa käyttöön värit, jotka valitsit navigaatiopalkille.

Toinen vaihtoehto on käyttää yhteisön paikallista CSS-koodia, ja käyttämällä attribuutteja theme tai theme-source infobox-tunnisteissa helpotat tiettyihin tietolaatikkomallineisiin kohdistuvien luokkien käyttöä.

  • Attribuuttia theme käytetään määrittämään mukautettu CSS-luokka tietolaatikkomallineelle.
  • Attribuutti theme-source sallii sinun muuttaa CSS-luokkaa mallineparametrin kautta.

Paljon lisätietoa näiden attribuuttien ja teeman käytöstä tietolaatikossa, sekä yksityiskohtaisia oppaita, löytyy sivulta Ohje:Tietolaatikot/CSS, tai katso Portability Hubista esimerkkityylejä ja -teemoja

Korostusvärit Muokkaa

Otsikon ja väliotsikon taustaa ja tekstiä voi värittää uudelleen tietolaatikkokohtaisesti käyttämällä korostettuja värejä. Niin kuin attribuutilla theme-source, käytetty väri määräytyy accent-color-source (taustoille) ja accent-color-text-source (tekstille) mallineparametrien mukaan .

Esimerkkinä: jos tietolaatikkomalline ilmoittaa accent-color-source="bkg" ja artikkelin tietolaatikk bkg = #FFF, otsikoiden taustaväri määräytyy arvon #FFF (valkoisen värin heksadesimaaliarvon) mukaan. Tällä tavalla määritelly värit täytyy kirjoittaa koko muotoon #FFF tai #FFFFFF, tai uudelleenväritys epäonnistuu.

Korostusvärit kirjaavat yli sekä teemoja käyttämällä määritellyt värit että oletusvärit.

Tähän lasketaan myös oletusvärin parametri, joten koodin accent-color-default="#FFF" käyttäminen asettaa värin kaikille otsikko- ja väliotsikkotaustoille, ja accent-color-text-default="#000000" toimii samalla tavalla asettaen tekstin oletusvärin heksadesimaaliformaattia käyttäen.

Useamman kuvan tai videon käyttöMuokkaa

Infoboxtabs.png

Kuvat välilehdissä

Käyttääksesi tietolaatikkossauseampaa kuvaa, voit käyttää yksinkertaisesti tunnistetta <image>.

{{Example
 |name   = Eddard Stark
 |image  = <gallery>
Eddard 1.jpg|Eddard on a horse
Eddard 2.jpg|Eddard in a house
Eddard 3.jpg|Eddard by a hearse
</gallery>
}}

Lisätietoa tästä ominaisuudesta löytyy tältä viestiketjulta.

Lisätäksesi videon tietolaatikkoon, käytä yksinkertaisesti <image> -tunnistetta, niin kuin kuvankin kanssa. Kun kuvan sijasta on lisättu video, tietolaatikossa näkyy näytekuva toistamiskuvaukkeen kera videon kestoajan näkyessä tietolaatikossa, ja klikkaamalla videota esiin tulee videontoistosovellus. Jos haluat lisätä useamman videon, lisää jokaista videota kohden uusi <image> -tunniste.

Tietojen ryhmitysMuokkaa

Advancedinfobox.png

Epätavalliset järjestykset ja ryhmittymät käytännössä

Nyt kun olet luonut yksinkertaisen tietolaatikon, voit opetella käyttämään edistyneempiä vaihtoehtoja. Alla olevassa osiossa näytämme kuinka rakennetaan samanlainen tietolaatikko kuin oikealla näkyy.

Tietolaatikko alkaa kolmella tietokentällä, sitten otsikko- ja kuvakentillä. Kuten näet, otsikkokentän ei tarvitse olla ensimmäisenä.

<infobox layout="stacked">
  <data source="prev"><label>Previous</label></data>
  <data source="conc"><label>Concurrent</label></data>
  <data source="next"><label>Next</label></data>
  <title source="name" />
  <image source="image" />
</infobox>
 

Tietojen ryhmitys ryhmätunnisteiden sisälläMuokkaa

<group>-kentällä voit ryhmittää kentät yhteen ja antaa niille otsikon. Muista: kentät, jotka ovat lisätty, mutta joilla ei ole arvoa, eivät näy. Tämä sääntö pätee myös ryhmiin - jos yhdeltäkin kentältä (muulta kun otsikkotunnisteelta) ryhmän sisällä puuttuu arvo, koko ryhmä ei näy.

<infobox layout="stacked">
  <data source="prev"><label>Previous</label></data>
  <data source="conc"><label>Concurrent</label></data>
  <data source="next"><label>Next</label></data>
  <title source="name" />
  <image source="image" />
  <group>
    <header>Details</header>
    <data source="conflict"><label>Conflict</label></data>
    <data source="date"><label>Date</label></data>
    <data source="place"><label>Place</label></data>
    <data source="result"><label>Outcome</label></data>
  </group>
</infobox>
 

Vaihtoehtoinen vaakasuora rakenne ryhmilleMuokkaa

Screen Shot 2015-06-16 at 13.27.08.png

Vaakasuora ryhmitys

Ryhmätunnisteella voi olla vaakasuora rakenne, missä kaikki sisältö ajetaan vierekkäisinä toisistaan yhdellä vaakarivillä. Tämä voidaan saavuttaa lisäämällä ryhmätunnisteeseen attribuutti layout="horizontal".

<group layout="horizontal">
   ...
</group>
 

Älykäs rakenne ryhmilleMuokkaa

"Älykäs" rakanne on samanlainen kuin vaakasuoran rakenne (joka takaa jäykät ja jäsennellyt rivit). Tämän avulla tietokentät valuvat yhdessä ryhmässä riviltä toiselle. Kun kenttien määrä saavutta määritellyn rajan, seuraava tietokenttä ilmestyy uudelle riville. Rivin kohteet rajautuvat täyttämään kaiken saatavilla olevan leveyden.

Käyttääksesi älykkäitä ryhmiä, lisää row-items="3" (tai jokin muu numero rajan asettamiseksi). Kaikki kohteet älykkäässä ryhmässä käytävät oletuksellisesti vaakasuoraa rakennetta, joten attribuutin lisääminen ei ole tarpeen jos käytät älykkäitä ryhmiä. On kuitenkin mahdollista, sekoittaa vaaka- ja pystysuorat tietokentät älykkääseen ryhmään lisäämällä attribuutin layout="default" yksittäiseen <data>-tunnisteeseen.

Saadaksesi tietokentän ottamaan enemmän kuin yhden tilan, käytä attribuuttia span="2" <data>-tunnisteessa.

<infobox>
  <title source="name" />
  <image source="image" />
  <group row-items="3">
    <header>Details</header>
    <data source="conflict"><label>Conflict</label></data>
    <data source="date"><label>Date</label></data>
    <data source="place"><label>Place</label></data>
    <data source="result" layout="default"><label>Outcome</label></data>
  </group>
</infobox>

Pakota kaikki ryhmäelementit näkyviinMuokkaa

Käytämällä attribuuttia show="incomplete", voit pakottaa kaikki ryhmäelementit näkymään, jopa kaikki tyhjät- paitsi jos kaikki ovat tyhjiä, jolloin ryhmää ei näytetä ollenkaan.

<group layout="horizontal" show="incomplete">
  <header>Combatants</header>
  <data source="side1" />
  <data source="side2" />
</group>

Nyt lisäämällä kaiken tämän yhteen, meillä on mallineen lopullinen koodi:

<infobox layout="stacked">
  <data source="prev"><label>Previous</label></data>
  <data source="conc"><label>Concurrent</label></data>
  <data source="next"><label>Next</label></data>
  <title source="name" />
  <image source="image" />
  <group>
    <header>Details</header>
    <data source="conflict"><label>Conflict</label></data>
    <data source="date"><label>Date</label></data>
    <data source="place"><label>Place</label></data>
    <data source="result"><label>Outcome</label></data>
  </group>
  <group layout="horizontal" show="incomplete">
    <header>Combatants</header>
    <data source="side1" />
    <data source="side2" />
  </group>
  <group layout="horizontal" show="incomplete">
    <header>Commanders</header>
    <data source="commanders1" />
    <data source="commanders2" />
  </group>
  <group layout="horizontal" show="incomplete">
    <header>Strength</header>
    <data source="forces1" />
    <data source="forces2" />
  </group>
  <group layout="horizontal" show="incomplete">
    <header>Casualties</header>
    <data source="casual1" />
    <data source="casual2" />
  </group>
  <data source="civilian"><label>Civilian casualties</label></data>
</infobox>

Nyt voimme käyttää sitä artikkelissa:

{{Battle
 |prev        = [[Battle of Fair Isle]]
 |conc        = [[Siege of Old Wyk]]
 |next        = [[Siege of Pyke]]
 |name        = [[Siege of Great Wyk]]
 |image       = Stannis Great Wyk.png
 |conflict    = [[Greyjoy Rebellion]]
 |date        = 289 AL
 |place       = [[Great Wyk]], the [[the Iron Islands]]
 |result      = [[Iron Throne]] victory
 |side1       = [[Tiedosto:Greyjoy.png|20px|link=House Greyjoy]] [[House Greyjoy]]
 |side2       = [[Tiedosto:Baratheon.png|20px|link=House Baratheon]] [[Iron Throne]]
 |commanders1 = Unknown
 |commanders2 = Lord [[Stannis Baratheon]]
 |casual1     = Unknown
 |casual2     = Unknown
}}
 

Kokoontaitettavat ryhmätMuokkaa

PI-Collapse.png

Kokoontaitettavat ryhmät käytännössä

Ryhmät vodaan muuttaa kokoontaitettaviksi lisäämällä joko collapse="open" tai collapse="closed" ryhmätunnisteeseen. Tämä tekee ryhmäotsikkorivistä klikattavan (ryhmän laajentamiseksi ja kokonntaittamiseksi), ja ryhmä on oletuksellisesti auki tai suljettu.

<group collapse="closed">
  <header>Appearances</header>
  <data source="films" />
  <data source="comics" />
</group>

Huomautus: otsikkorivin, jossa on sisältöä , on tultava heti ryhmätunnisteen jälkeen, jotta tämä toimisi.

Edistynyt käyttöMuokkaa

MuotoiluMuokkaa

Jos haluat lisätä jotain ylimääräistä tietoa - kuten joitakin kuvakkeita, luokkia - tai käsitellä annettuja arvoja, kentän muotoilu sallii sinun tehdä sen.

  • Kun format-tunniste on käytössä, muuttuja, joka syötetään attribuutille source=, muotoillaan/muokataan määritellyksi format-tunnisteen sisällä.
  • Jos attribuutissa source= on tyhjä muuttuja, solmu renderöi arvot default-tunnisteista (tai ei, mikäli default-tunnisteita ei ole määritelty).

Muutama esimerkki käyttötapauksista:

  • Lisäteksti – <format>${{{price}}}</format>
  • Linkit – <format>[[{{{location}}}]]</format>
  • Luokat – <format>[[Luokka:{{{car type}}}]]</format>

Esimerkiksi, voimme lisätä mallineen {{money icon}}:

<data source="price">
  <label>Price</label>
  <format>{{{price}}} {{money icon}}</format>
</data>

Oikealla näytetty vaiktus voidaan saavuttaa seuraavanlaisella koodilla:

Field mutators.png

Muotoillut kentät

<header>Price to buy</header>
<data source="buyhaggle">
  <label>Price with Haggling</label>
  <format>{{{buyh}}} {{money icon}}</format>
</data>
<data source="buy">
  <label>Undiscounted price</label>
  <format>{{{buy}}} {{money icon}}</format>
</data>
<data source="sell">
  <label>Price to sell</label>
  <format>{{{sell}}} {{money icon}}</format>
</data>
<data source="weight">
  <label>Weight</label>
  <format>{{{weight}}} {{weight icon}}</format>
</data>

JäsennysfunktiotMuokkaa

Jäsennysfunktioita voi lisätä mihin tahansa tietolaatikkoon. Tulokset kuitenkin piilotetaan automaattisesti, mikäli parametri, tunniste tai tietolähde ei sisällä tekstiä.

Mallinekoodi Tulos
<data source="level">
  <label>Rank</label>
  <default>Orc {{#switch:{{{level}}}|1=peon|2=grunt|#default=grunt}}</default>
</data>

Esimerkkejä Muokkaa

Lisäohjeet ja palaute Muokkaa

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.

Ympäri Wikian verkkoa
Hae mainospaikkaa

Satunnainen wiki