Ohje:Taulukot

Wikipediassa voi kirjoitella HTML- ja XML-tauluja, mutta sitä ei suositella. Käytä mieluimmin wiki-formaattia, jota kutsutaan myös nimellä putkimuoto (engl. pipe-format). Wikitaulu on helppo kirjoittaa, mutta mutkikkaita tauluja on silläkin vaikea luoda.

Taulukoita voi muokata ja tehdä myös visuaalisella muokkaimella, jolloin muokkaajan ei tarvitse ymmärtää taulukon koodia.

Taulukko on riveistä ja sarakkeista koostuva kokonaisuus. Rivin ja sarakkeen risteyskohdassa on solu. Monesti taulukossa on myös otsikko ja sarakkeiden otsikot. Usein monta solua on yhdistetty joko vaaka- tai pystysuunnassa.

Wikitauluissa käytetään niin sanottua putkisyntaksia (engl. pipe syntax)

• Taulu alkaa merkeillä: {| taulun lisämääreet, jossa lisämääreet on normaalisti class="wikitable"
• Taulu loppuu riviin: |}
• Taulun otsikko on |+ otsikko mikä kirjoitetaan seuraavalle riville taulukon alkumerkin {| jälkeen.
• Taulukon rivi alkaa uudelta riviltä merkillä |- rivin lisämääreet.
• Rivin solut merkitään seuraaville riveille putkimerkillä |.
• Useamman solun voi kirjoittaa samalle riville käyttämällä solujen välissä tuplaputkea ||
• Solut voivat tekstin lisäksi sisältää myös määritteitä. Määritteen ja solun sisällön välissä on aina yksinkertainen putkimerkki |

| Solun sisältö tai | solun määritteet | Solun sisältö
| 1. solu || 2. solu tai | 1. solun määritteet | 1. solun sisältö || 2. solun määritteet | 2. solun sisältö
| 1. solu || 2. solun määritteet | 2. solun sisältö || 3. solu || 4. solu

• Jos solu on otsikko, niin solu aloitetaan huutomerkillä !. Jos otsikkosoluja halutaan kirjoittaa samalle riville käytetään solujen erottimena tuplahuutomerkkiä !!, mutta määritteen ja sisällön erottimena kuitenkin putkea.

! Solun sisältö tai ! solun määritteet | Solun sisältö
! 1. solu !! 2. solu tai ! 1. solun määritteet | 1. solun sisältö !! 2. solun määritteet | 2. solun sisältö
! 1. solu !! 2. solun määritteet | 2. solun sisältö !! 3. solu !! 4. solu

• Määritteet ovat normaalia HTML-koodia, esimerkiksi color="#FFFFFF"

Usein on selkeintä ja turvallisinta kirjoittaa jokainen solu omalle rivilleen.

Taulukon tyyli määritellään kuin HTML:n tyylitagissa (engl. style sheet).

{| class="wikitable"
|-
| Solu 1, rivi 1 
| Solu 2, rivi 1 
|- 
| Solu 1, rivi 2 
| Solu 2, rivi 2 
|}

Vaihtoehtoisesti solut voidaan luetella samalla rivillä, jolloin niiden väliin laitetaan kaksi pystyviivaa:

{| class="wikitable"
|-
| Solu 1, rivi 1 || Solu 2, rivi 1 
|- 
| Solu 1, rivi 2 || Solu 2, rivi 2 
|}

Yllä olevat taulukot näyttävät seuraavanlaiselta

Solu 1, rivi 1	Solu 2, rivi 1
Solu 1, rivi 2	Solu 2, rivi 2

{| class="wikitable"
|+ Otsikko
! Sarakkeen 1 otsikko
! Sarakkeen 2 otsikko
|-
| rivi1, solu1 || rivi1, solu2
|- 
| rivi2,solu 1|| rivi2, solu2
|}

Yllä oleva taulukko näyttää seuraavanlaiselta

Otsikko

Sarakkeen 1 otsikko	Sarakkeen 2 otsikko
rivi1, solu1	rivi1, solu2
rivi2,solu 1	rivi2, solu2

<!-- taulukon määritteet: luokka wikitable ja tekstin tasaus keskelle eli text align:center -->
{| class="wikitable" style="text-align:center"
|+Kertotaulu
|-
! &times; !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}

Yllä oleva taulukkolistaus näyttää seuraavanlaiselta

Kertotaulu

×	1	2	3
1	1	2	3
2	2	4	6
3	3	6	9
4	4	8	12
5	5	10	15

Solun määrite on solun ominaisuus, esimerkiksi yksittäisen solun väri. Wikissä voidaan väri ulottaa koko tauluun, yksittäiseen riviin tai yksittäiseen soluun. Väreistä käytetään englanninkielisiä nimiä red, green, yellow ja niin edelleen, tai heksadesimaalikoodeja, jotka ovat muotoa #000000 (musta, black). Heksadesimaaliväri esitetään RGB-muodossa (red, green, blue eli punainen, vihreä ja sininen). RGB-merkintä menee #RRGGBB, jossa RR on värin punainen osa, GG vihreä ja BB sininen osa. 00 ei väriä, FF täysi väriannos. Heksadesimaaliluvut eli 16-järjestelmän luvut ovat 0-9, A-F.

Esimerkiksi kirkkaan punainen on #FF0000, himmeämmän punainen #7F0000. Keltainen on #FFFF00, koska keltaisessa on punaista ja vihreää. Kts. Luettelo väreistä

{| 
| bgcolor=red | <font color=white> abc
| def
<!-- punainen taustaväri ulottuu yhteen soluun-->
| style="background:red; color:white" | ghi
| jkl
|}

Yllä oleva taulukkolistaus näyttää seuraavanlaiselta

abc

def

ghi

jkl

<!-- taustaväri keltainen, yellow, ulottuu koko riville,
samoin kuin tekstin vihreä (green) väri-->
{| style="background:yellow; color:green"
|- 
| abc
| def
| ghi
|- style="background:red; color:white" <!--ulottuu koko riville-->
| jkl
| mno
| pqr
|-
| stu
| style="background:silver" | vwx
| yz
|}

Yllä oleva taulukkolistaus näyttää seuraavanlaiselta

abc	def	ghi
jkl	mno	pqr
stu	vwx	yz

HTML 4.01 määrittää 16 esimääriteltyä väriä, joiden heksadesimaalitunnukset ovat:

black	#000000		silver	#c0c0c0		maroon	#800000		red	#ff0000
navy	#000080		blue	#0000ff		purple	#800080		fuchsia	#ff00ff
green	#008000		lime	#00ff00		olive	#808000		yellow	#ffff00
teal	#008080		aqua	#00ffff		gray	#808080		white	#ffffff

Sarakkeen leveys ja taustaväri asetetaan yhtä aikaa rivin toiselle solulle

{|
|-
| bgcolor=red|cell1 || width=300px bgcolor=blue |cell2 || bgcolor=green|cell3
|}

Yllä oleva taulukkolistaus näyttää seuraavanlaiselta

cell1

cell2

cell3

Koko taulukon ja rivin sekä taulukon solujen leveyttä ja korkeutta (width, height) voi säädellä.

{| style="width:75%; height:200px" border="1"
|- 
| abc
| def
| ghi
|- style="height:100px" 
| jkl
| style="width:200px" |mno
| pqr
|-
| stu
| vwx
| yz
|}

Yllä oleva taulukkolistaus näyttää seuraavanlaiselta

abc	def	ghi
jkl	mno	pqr
stu	vwx	yz

Wikitaulussa käytetään samaan tapaan kuin HTML:ssä solujen yhdistämiseen. Esimerkiksi colspan=2 leventää taulukon solua kahden sarakkeen alueelle, ja rowspan=3 pidentää solua kolmen rivin alueelle. Colspanin ja rowspanin käyttö vaatii taitoa.

{| border=1
| Sarake 1, rivi 1 
|rowspan=2| Sarake 2, rivi 1 (ja myös 2) 
| Sarake 3, rivi 1 
|- 
| Sarake 1, rivi 2 
| Sarake 3, rivi 2 
|}

Yllä oleva taulukkolistaus näyttää seuraavanlaiselta

Sarake 1, rivi 1	Sarake 2, rivi 1 (ja myös 2)	Sarake 3, rivi 1
Sarake 1, rivi 2		Sarake 3, rivi 2

{| border="1" cellpadding="5" cellspacing="0"
|-
! Sarake 1 || Sarake 2 || Sarake 3
|-
| rowspan=2| A
| colspan=2 align="center"| B
|-
| C
| D
|-
| E
| colspan=2 align="center"| F
|- 
| rowspan=3| G
| H
| I
|- 
| J
| K
|-
| colspan=2 align="center"| L
|}

Yllä oleva taulukkolistaus näyttää seuraavanlaiselta

Sarake 1	Sarake 2	Sarake 3
A	B
	C	D
E	F
G	H	I
	J	K
	L

Solun sisällä olevan tekstin keskittäminen käy seuraavalla tavalla:

<center>Solu</center>

Se käy pipe-syntaksissa helpommin tyyliin:

center | Solu

<blockquote>
{| cellpadding=0 cellspacing=0
|align=right| 432 || .1
|-
|align=right| 43 || .21
|-
|align=right| 4 || .321
|}
</blockquote>

Ylläoleva taulukkolistaus näyttää seuraavanlaiselta:

432	.1
43	.21
4	.321

<blockquote>
{|border = 1 cellpadding=4 cellspacing=2 width=72
|
{|cellpadding=0 cellspacing=0 width="100%"
|align=right width="50%"| 432 ||width="50%"| .1
|}
|-
|
{|cellpadding=0 cellspacing=0 width="100%"
|align=right width="50%"| 43 ||width="50%"| .21
|}
|-
|
{|cellpadding=0 cellspacing=0 width="100%"
|align=right width="50%"| 4 ||width="50%"| .321
|}
|}
</blockquote>

Ylläoleva taulukkolistaus näyttää seuraavanlaiselta

432 .1

43 .21

4 .321

Wikitaulu tuottaa aina HTML:ää Wikipedian systeemissä.

Taulukon määritelmä:

 {| ''määritteet''
 |}

Jota vastaa HTML:n

 <table ''määritteet''>
 </table>

Välilyönti oltava {|;:n jälkeen.

HTML:n <tr>:tä vastaava uusi rivi alkaa wikitaulussa

|-

<tr>

Määritteitä (väri jne) lisätään jokaista riviä koskien näin

|- määritteet

Joka tuottaa HTML:ään

<tr määritteet>

Uusia soluja tuotetaan kirjoittamalla näin.

|solu1
|solu2
|solu3

Tai myös näin

|solu1||solu2||solu3

Joista molemmat vastaavat HTML:n

<td>solu1</td><td>solu2</td><td>solu3</td>

ja niin "||" vastaa "rivinvaihto" + "|"

Parameters in cells can be used like this:

|params|cell1||params|cell2||params|cell3

which will result in

<td määritteet>solu1</td>
<td määritteet>solu2</td>
<td määritteet>solu3</td>

Rivien otsakkeet toimivat kuin

HTML:n tagi TD, paitsi "!" :tä käytetään rivin tai sarakkeen otsikon tunnuksena "|". "!!" :ta voi käyttää "||":n tilalla. Määritteiden erottimena käytetään !:ta huolimatta "|"

 Esim:
!määritteet|solu1

A <caption> HTML-tagia vastaa

|+ Otsikko

Joka tuottaa

<caption>Otsikko</caption>

Voit myös käyttää määritteitä

|+ määritteet|Otsikko

Joka tuottaa

<caption määritteet>Otsikko</caption>

Wikitaulu-putkimuoto ja HTML vertailtuna.

{| määritteet 
|}

|+ otsikko

|- määritteet 

| solu
| solu2

|solu1||solu2||solu3

! otsake

<table>
   <tr>
      <td>1</td>
      <td>2</td>
   </tr> 
   <tr>
      <td>3</td> 
      <td>4</td> 
   </tr>
</table>

<table>
   <tr>
      <td> 1 <td> 2
   <tr>
      <td> 3 <td> 4
</table>

{| 
| 1 || 2
|- 
| 3 || 4
|}

<table>
   <tr>
      <td>1</td>
      <td>2</td>
   </tr> 
   <tr>
      <td>3</td>
      <td>4</td>
   </tr>
   <tr>
      <td>5</td>
      <td>6</td>
   </tr>
</table>

<table>
   <tr>
      <td> 1 <td> 2
   <tr>
      <td> 3 <td> 4
   <tr>
      <td> 5 <td> 6
</table>

{| 
| 1 || 2 
|- 
| 3 || 4 
|- 
| 5 || 6 
|}

<gallery>-tagilla voidaan tuottaa kuvagalleriaa muistuttava taulukko:

<gallery>
Drenthe
Flevoland
Friesland
Gelderland
Groningen
Limburg
North Brabant (capital: [[Den Bosch]]) <!--ei tule näkyviin, galleria ei tue wikilinkitettyä tekstiä-->
North Holland
Overijssel
South Holland
Utrecht
Zeeland
</gallery>

Yllä oleva listaus näyttää seuraavanlaiselta

• Tiedosto:Drenthe
• Tiedosto:Flevoland
• Tiedosto:Friesland
• Tiedosto:Gelderland
• Tiedosto:Groningen
• Tiedosto:Limburg
• Tiedosto:North Holland
• Tiedosto:Overijssel
• Tiedosto:South Holland
• Tiedosto:Utrecht
• Tiedosto:Zeeland

Kelluva taulukko määritellään esimerkiksi float=right. Normaalisti kelluvia taulukoita ei kannata käyttää, ne ovat häiritsevän näköisiä.

Koodi

{| class="wikitable" style="float: right; margin: 0 0 0.5em 0.5em; text-align: center;"
|-
! x !! 1 !! 2
|-
! A
| A1 || A2
|-
! B
| B1 || B2
|}

tulostaa sivulle

Jos taulukolle on asetettu yleinen tekstintasaus, se vaikuttaa oletusarvoisesti kaikkiin soluihin. Jos tällaisen taulukon solun tekstiä halutaan tasata eri tavalla, on tasaus asetettava kullekin solulle erikseen. Tasausta ei voi asettaa sarakkeittain.

Seuraavassa esimerkissä taulukko, jossa käytetään yleistä tasausta keskelle, mutta oikeanpuoleisin kommenttikenttä tasataan vasemmalle.

{| class="wikitable" style="text-align:center"
|-
!Otsikko !! Lukuarvo 1 !! Lukuarvo 2 !! Lukuarvo 3 !! style="text-align:left" | Kommentteja			
|-
! Ensimmäinen otsikko 
| 5-20 || 25-35 || 50-70 || style="text-align:left" | Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat
|-
! Toinen otsikko 
| 40 || 30 || 30 || style="text-align:left" | Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat
|}

Tämä tuottaa seuraavan taulukon:

HUOMAA: Align=right on taulukolle yleensä suuressa taulukossa huono valinta taulukon määritteisin, koska se siirtää kaiken taulukon jälkeen tulevan tekstin taulukon leveyden verran oikealle.

Tarvittaessa voidaan taulukkoon liittää automaattinen aakkostus. Sarakkeiden otsikoiden vieressä olevilla painikkeilla voidaan tällaisen taulukon rivit aakkostaa valitun sarakkeen mukaan nousevasti tai laskevasti. Lajittelu aakkostaa asiat tekstinä ja jos halutaan aakkostaa lukuja tai jonkin muun lajitteluavaimen kuin näkyvän tekstin mukaan, niin sarakkeeseen sijoitettu sisältö pitää sijoittaa lajittelumallineen sisään.

Lajittelumalline luvuille on {{Nts}} ja vapaasti määriteltäville lajitteluavaimille on malline {{Lajiteltava}}.

Koodi

{| class="wikitable sortable" style="margin: 0.5em 0 0 0;"
|-
! Sarake1 !! Sarake2 !! Sarake3
|-
| rivi1sarake1 || rivi1sarake2 || rivi1sarake3
|-
| rivi2sarake1 || rivi2sarake2 || rivi2sarake3
|-
| || ||
|-
| || ||
|}

tulostaa sivulle

Yksittäisen sarakkeen lajittelu voidaan poistaa lisäämällä

class="unsortable"|

sarakeotsikon eteen.

Edellisen tavoin toimiva "wikitable collapsible" tekee taulukosta oletuksena näkyvän, joka on mahdollista piilottaa. "wikitable collapsible collapsed" piilottaa taulukon oletuksena, ja sen voi avata "show"-linkkiä painamalla.

Koodi

{| class="wikitable collapsible" border="1"
|+ taulukkoteksti
! otsikko !! otsikko !! otsikko
|-
| solu || solu || solu
|-
| solu || solu || solu
|}

Tulostaa sivulle

HTML-taulukon muuttaminen wikitaulukoksi onnistuu käsinkin mutta on työlästä touhua. Muuntaminen onnistuu helpoiten verkossa olevan muuntajan avulla. Se pyytää tekstiruutuun taulukon HTML:koodia (löytyy yleensä selaimen lähdekoodi-valikosta) ja antaa toiseen tekstiruutuun taulukon wikitaulu-esityksen, joka lisätään wikipedian sivulle. Joitain taulukkomuuntajia jotka muuntavat tauluja HTML:stä wikimuotoon on verkossa. Muuntamisen jälkeen taulukkoa voi siivota esimerkiksi tavallisella tekstinkäsittelyohjelmalla. Jotkut konvertterit tuottavat tarpeetonta roskaa wikitaulu-koodiin. Jos on esimerkiksi ylimääräisiä <font size="+1">-tageja ja </font>-tageja, ne voi ottaa pois etsi-korvaa-toiminnalla. Näin wikitaulu tulee tiiviseen tilaan ja käyttää yleisiä fonttimäärityksiä.

• http://jannenau.50megs.com/codexyz/htwiki/hotwiki.html HotWiki poistaa värit ja fontit taulusta.
• http://area23.brightbyte.de/csv2wp.php

Koeohjelma, joka vaihtaa haluttaessa wikitaulun sarakkeita ja luo HTML-taulusta prettytable-tauluun. Ohjelma hävittää monet taulukon solujen määreet ja taustavärit sekä fontit. Vain colspan ja rowspan jäävät. Ohjelmaa käytetään komentoriviltä eli ns. DOS-kehotteesta, ja siitä on myös Windows-versio. Ohjelmaa koskeva palaute osoitteeseen mailto:kiviapaja@hotmail.com (toivomukset, ehdotukset ja virheraportit). Ohjelma ei tue täysin läheskään kaikkia HTML:ssä olevia erilaisia taulukoita, mutta tekee useimmissa tapauksessa suurimman osan raskaasta muuntotyöstä ja siksi lienee hyödyllinen.

Ohjelmaan syötetään sisään html-koodi, jossa on yksi taulukko. Sisäänsyöttötiedoston on oltava puhdasta ASCII-tekstiä, ei esimerkiksi Wordin .DOCia.

ohjelman käyttö:

htwiki in.html

antaa out.txt:ssä wikitaulun.

HTWIKI:n "virallinen lataussivu":

• http://jannenau.50megs.com/codexyz/htwiki/htwiki.html

Kaksisarakkeisen taulukon teko ei yleensä kannata.

Älä tee näin

1980	Yksi
1988	Kaksi
1994	Kolme
1994	Neljä

Tee mieluummin näin

• 1980: Yksi
• 1988: Kaksi
• 1994: Kolme
• 1994: Neljä

• Help:Collapsing