{{Wikipedia:Nawigacja/Formatowanie stron}}
Hasła wikipedii mogą zawierać tabele prezentujące różnorodne dane. Do ich tworzenia można użyć znaczników języka HTML jak np. <table>, <tr>, <td>, <th> i <caption>, ale zamiast tego zalecane jest używanie specjalnych znaczników składni wiki wprowadzonych przez Magnusa Manske. Znaczniki tej składni, za jednym wyjątkiem, muszą zaczynać się od początku nowej linii.
Pierwsza utworzona tabela jest dokładnie opisana, druga zawiera te same dane, lecz ma zmienione parametry. Warto porównać te parametry i zwrócić uwagę na ich skutek w utworzonych tabelach.
Wyrównanie tabelki (right/left - do prawej/do lewej)
Grubość krawędzi tabelki
Odstępy między komórkami tabelki
Odstępy między tekstem a krawędziami komórki
class="wikitable"
Określenie klasy tabelki (zalecana właśnie wikitable). Dodatkowe klasy do tej samej tabelki można ewentualnie podać po spacji (np. class="wikitable error" da w wyniku tabelkę z dużymi czerwonymi napisami)
class="sortable"
Włączenie sortowania tabeli po wybranych kolumnach — do użycia po {|
class="unsortable"
Wyłączenie kolumny z sortowania — do użycia w kolumnie, w pierwszym wierszu
class="sortbottom"
Wyłączenie wiersza z sortowania — do użycia w opisie wiersza, zaraz po |-
style="
width: 30%;
text-align:left;
text-align:center;
text-align:right;
;"
Otwieranie określeń styli
Tabelka zajmie 30% szerokości artykułu
Wyrównanie tekstu do lewej
..do środka
..do prawej
Po każdej wartości stawiamy ; a na końcu wszystko zamykamy "
| wartość |
| rowspan=n |
| colspan=n |
| bgcolor="FFF2B2" |
W ten sposób możemy wstawić, styl, tło, klasę, dla pojedynczego wersu, np.
Scala n kratek w pionie
Scala n kratek w poziomie
Zabarwia tło komórki na kolor ciemnożółty
<br clear="all"/>
Powoduje, że tabelka jest wyrównywana względem tekstu, np. względem kolejnej sekcji artykułu
co da w efekcie schludnie sformatowaną tabelę z ramką i wyróżnieniem pól poprzedzonych wykrzyknikiem (pola nagłówkowe):
kolumna 1, wiersz 1
kolumna 2, wiersz 1
kolumna 1, wiersz 2
kolumna 2, wiersz 2
Wyrównywanie tekstu[]
Użycie parametru align[]
Parametr ten jest obecnie uważany przez ekspertów za przestarzały, jednak jest krótszy w zapisie niż nowsza wersja.
Komórka 1, wiersz 1
Komórka 2, wiersz 1
Komórka 3, wiersz 1
Komórka 4, wiersz 1
do prawej
wyśrodkowane
do lewej
też do lewej
{| class="wikitable"
! Komórka 1, wiersz 1
! Komórka 2, wiersz 1
! Komórka 3, wiersz 1
! Komórka 4, wiersz 1
|-
| align="right" | do prawej
| align="center" | wyśrodkowane
| align="left" | do lewej
| też do lewej
|}
Jak widać domyślnie (bez podania parametrów), zwykłe komórki są wyrównywane do lewej.
Użycie parametru style do wyrównania[]
Parametr style jest zalecany przez ekspertów, jednak w tym wypadku jego stosowanie wymaga nieco większego wysiłku.
Komórka 1, wiersz 1
Komórka 2, wiersz 1
Komórka 3, wiersz 1
do prawej
wyśrodkowane
do lewej
{| class="wikitable"
! Komórka 1, wiersz 1
! Komórka 2, wiersz 1
! Komórka 3, wiersz 1
|-
| style="text-align:right" | do prawej
| style="text-align:center" | wyśrodkowane
| style="text-align:left" | do lewej
|}
Użycie tego parametru nabiera znaczenia, gdy chcemy sformatować całą tabelę (lub większość komórek) tak, aby były np. wyrównane do prawej:
Komórka 1, wiersz 1
Komórka 2, wiersz 1
Komórka 3, wiersz 1
to do prawej
i to do prawej
i to
{| class="wikitable" style="text-align:right"
! Komórka 1, wiersz 1
! Komórka 2, wiersz 1
! Komórka 3, wiersz 1
|-
| to do prawej
| i to do prawej
| i to
|}
Wówczas do wyrównania tekstu w poszczególnych komórkach możemy użyć np. atrybutu align.
Komórka 1, wiersz 1
Komórka 2, wiersz 1
Komórka 3, wiersz 1
to do prawej
i to do prawej
a to do lewej
{| class="wikitable" style="text-align:right"
! Komórka 1, wiersz 1
! Komórka 2, wiersz 1
! Komórka 3, wiersz 1
|-
| to do prawej
| i to do prawej
| align="left" | a to do lewej
|}
Użycie szablonu dla liczb[]
W przypadku, gdy tekst w komórce przedstawia liczbę do jego wyrównywania pomocny jest wcześniej opisany szablon {{L}}. Opis jego stosowania jest tu. Nie należy jednak nadużywać tego szablonu, ponieważ powoduje on zarówno wolniejsze przetwarzanie strony, jak i to, że kod strony znacznie się wydłuża!
Tabela z tytułem[]
Jeżeli chcemy, aby pojawił się tytuł tabeli nad nią, używamy kodu |+
Tytuł tabeli. Pojawia się bez ramki nad tabelą i jest wycentrowany
Pierwsza kolumna
Druga kolumna
Komórka 1, wiersz 1
Komórka 2, wiersz 1
Komórka 1, wiersz 2
Komórka 2, wiersz 2
Komórka 1, wiersz 3
Komórka 2, wiersz 3
Komórka 1, wiersz 4
Komórka 2, wiersz 4
{| class="wikitable" align=right
|+ '''Tytuł tabeli. Pojawia się bez ramki
nad tabelą i jest wycentrowany'''
!Pierwsza kolumna
!Druga kolumna
|-
|Komórka 1, wiersz 1
|Komórka 2, wiersz 1
|-
|Komórka 1, wiersz 2
|Komórka 2, wiersz 2
|-
|Komórka 1, wiersz 3
|Komórka 2, wiersz 3
|-
|Komórka 1, wiersz 4
|Komórka 2, wiersz 4
|}
jest widoczna po prawej
Kolory komórek[]
Żeby uzyskać różne kolory komórek, wstawiamy przed każdą komórką polecenie bgcolor="xxxxxx" |, zamiast xxxxxx wpisujemy odpowiedni parametr koloru - lista parametrów znajduje się np. na stronie artykułu barwa. Poniżej znajduje się kilka przykładów dla zastosowania różnych kolorów.
Zastosowanie poniższego kodu
{|class="wikitable"
!coś
!coś
!coś
|-
| bgcolor="FFF2B2" | kolor taki
| bgcolor="DBF5FF" | kolor inny
| bgcolor="FAD2B2" | kolor inny
|}
daje taki efekt:
coś
coś
coś
kolor taki
kolor inny
kolor inny
Jeżeli chcemy uzyskać dla całego wiersza jeden kolor, można to zrobić łatwiej:
{|class="wikitable"
!coś
!coś
!coś
|-bgcolor="FFF2B2"
|jeden kolor
|we wszystkich
| komórkach wiersza
|-bgcolor="DBF5FF"
|a w tym wierszu
|inny
|kolor
|}
Uwaga: Jeśli główna tabela ma podany parametr class="wikitable" wówczas kolorowanie tła tabeli zagnieżdżonej nie funkcjonuje poprawnie.
Sortowanie danych w tabelach[]
Istnieje specjalna opcja, która pozwala na sortowanie danych w kolumnach tabeli. Aby ją uzyskać, należy zastąpić class="wikitable" opcją class="wikitable sortable" tak jak w poniższym kodzie.[]
{| class="wikitable sortable" style="text-align:right;" align="right"
!width="100px"| Kolumna główna
!width="80px"| Sortowanie alfabetyczne
!width="80px"| Sortowanie wg liczb
!width="80px"| Sortowanie z innymi znakami
|-
! Rok 2006
| Muzyka
| 245
| 18
|-
! Rok 2005
| Literatura
| 127
| -
|-
! Rok 2004
| Technika
| 52
| 32
|-
! Rok 2003
| Ogrodnictwo
| 21
| ?
|}
Kod ten pozwoli uzyskać poniższą tabelę, w której klikając w "znaczek" w nagłówku czytelnik uzyskuje sortowanie zmiennych umieszczonych w kolumnach.[]
Kolumna główna
Sortowanie alfabetyczne
Sortowanie liczb
Sortowanie z innymi znakami
Rok 2006
Muzyka
245
18
Rok 2005
technika
127
-
Rok 2004
Technika
52
32
Rok 2003
Ogrodnictwo
21
?
Istnieje możliwość wskazania aby niektóre kolumny nie mogły być użyte do sortowania tabeli:[]
Kolumna główna
Po tej kolumnie nie sortujemy
Sortowanie liczb
Rok 2006
Szablon:Tak
245
Rok 2005
Szablon:Nie
127
Rok 2003
nie sortujemy
21
Efekt uzyskuje się dodając class="unsortable" w opisie kolumny w pierwszym wierszu (główce) tabeli:=[]
{| class="wikitable sortable" style="text-align:right;"
!width="100px"| Kolumna główna
!width="80px" class="unsortable"| Nie sortujemy
!width="80px"| Sortowanie liczb
...
Jak również można wskazać aby dolne wiersze nie podlegały sortowaniu i zawsze zostawały na dole tabeli:[]
Kolumna główna
Po tej kolumnie nie sortujemy
Sortowanie liczb
Rok 2006
Szablon:Tak
245
Rok 2005
Szablon:Nie
127
Rok 2003
nie sortujemy
21
Podsumowanie
Sortowanie tabel nie jest trudne
45
Tu wystarczy podać atrybut wiersza class="sortbottom":=[]
|-
! Rok 2003
| nie sortujemy
| 21
|- class="sortbottom"
!Podsumowanie
|Sortowanie tabel nie jest trudne
| 45
|}
Tabele w HTML (niezalecane)[]
Obecnie tabele mogą być zupełnie skutecznie tworzone przy pomocy mechanizmu wiki. Niemniej jednak, osobom przyzwyczajonym do HTML może być łatwiej tworzyć tabele przy pomocy znaczników tego języka. Przed wstawieniem tabeli napisanej w HTML warto jednak zawsze rozważyć, czy nie da się tego zrobić prościej przy pomocy technik wiki.
Poniżej przedstawiamy znaczniki wiki służące do tworzenia tabel zestawione z ich równoważnikami w HTML:
Tabela jako taka jest definiowana przez:
{| parametry
|}
co odpowiada w HTML:
<table parametry>
</table>
Uwaga Między "|" i "parametry" oraz poszczególnymi parametrami musi być spacja.
Pojedyncze kolumny tabeli (odpowiednik "<td>" w HTML) są tworzone przez:
a zatem "||" jest równoważne układowi "nowa linia" + "|"
Kolejne kolumny, podobnie jak w HTML/XHTML są ustawiane standardowo w jednym wierszu.
Parametry kolumn mogą być wprowadzane w następujący sposób:
|params|kolumna1
co odpowiada w HTML:
<td params>kolumna1</td>
Dla pierwszej kolumny znacznik "<TR>" jest tworzony automatycznie i również dla ostatniej kolumny w tabeli znacznik "</TR>" jest automatycznie dodawany przez mechanizm wiki.
Tworzenie kolejnych wierszy (odpowiednik "<TR>" w HTML) dokonuje się tak
samo jak tworzenie kolejnych kolumn tylko zamiast "|" wpisuje się "|-".
Parametry wiersza można dodawać analogicznie do parametrów kolumn:
|- parametry
pamiętając o niezbędnej spacji między "|-" i parametrami.
Bardziej złożony przykład z zastosowaniem parametrów i połączonych wierszy: