Yardım:Tablo

Temel Bilgiler | Sayfa Düzenleme | Maddelerin Düzenlenmesi | Teknik ve Yapılanma | Telif

Çubuk söz dizimi

Tablo oluştururken, HTML tablo söz diziminin yanı sıra, özel wiki kodları da kullanılabilir:

• Tablo, "{| seçimli tablo değişkenleri " satırıyla başlar ve "|}" satırıyla biter.

• İsteğe bağlı bir tablo başlığı, "{|" dan sonra "|+ başlık " satırıyla ilave edilebilir.

• Tablo sırası kodu, "|- seçimli tablo değişkenleri " satırını ve her biri yeni bir satırdan başlamak ve newline veya "|" ile ayrılmak üzere, o sıradaki hücrelerin kodlarını içerir.

• Tablo verileri, hücrelerin kodlarıdır. Hücre kodu "| değer " veya "| hücre değişkenleri | değer " şeklindedir.

• Sütun başlıkları sırası, bir hücre parametresi ile bir değer arasında ayıraç olma durumunun dışında "|" yerine "!" kullanılarak belirlenir. Normal bir tablo sırası için fark, tarayıcıya bağlı olup sütun başlıkları genellikle koyu fontlarla gösterilir.

• Bir sıranın ilk hücresi sıra başlığı olarak adlandırılır ve satıra, "|" yerine "!" ile başlanır. Peşisıra gelen veri hücreleri yeni satırdan başlar.

Tablo ve hücre değişkenleri, HTML dekilerle aynıdır (bkz. [1] ve HTML element#Tablolar). Ancak, thead, tbody, tfoot, colgroup, ve col elementleri mevcut durumda MediaWiki tarafından desteklenmemektedir.

Hücrelerinin hepsinin içi boş olsa dahi bir tablo gene de yararlı olabilir çünkü hücrelerde arka plan renkleri kullanarak tablo bir diyagrama dönüştürülebilir, örneğin bkz. m:Template talk:Square 8x8 pentomino example. Tablo formatında bir şekil üzerinde, sisteme yüklenmiş bir şekile göre daha kolay düzenleme yapılabilir.

Birkaç satıra (veya sütuna) yayılan hücreler olmadığı sürece, tablodaki sütun sayısının sabit olabilmesi için her sırada aynı sayıda hücre bulunmalıdır (aşağıdaki Mélange örneğine bkz.). Boş hücrelerin görünmelerini sağlamak için, boşluk karakterini ( ) kullanınız.

Örnekler

Basit bir örnek

{| 
| Hücre 1, satır 1 
| Hücre 2, satır 1 
|- 
| Hücre 1, satır 2 
| Hücre 2, satır 2 
|}

ve

{| 
| Hücre 1, satır 1 || Hücre 2, satır 1 
|- 
| Hücre 1, satır 2 || Hücre 2, satır 2 
|}

ikisinin de çıktısı

Hücre 1, satır 1	Hücre 2, satır 1
Hücre 1, satır 2	Hücre 2, satır 2

Çarpım tablosu

Kaynak kodu

{| border="1" cellpadding="2"
|+Çarpım tablosu
|-
! × !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}

Çıktısı

Çarpım tablosu

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

Renklendirme; değişkenler

Bir hücrede yazının ve arka fonun rengini belirlemek için iki yol vardır:

{| 
| bgcolor=red | <font color=white> abc
| def
| style="background:red; color:white" | ghi
| jkl
|}

çıktısı:

abc

def

ghi

jkl

Görüldüğü gibi "font" sadece bulunduğu hücre için ve sonlandırıcı etiket olmaksızın geçerli olmuştur. Sonlandırma etiketini sistem kendisi oluşturmaktadır.

Renkler, diğer değişkenlerde olduğu gibi tüm bir satır ya da tablo için tanımlanabilir; satır değişkenleri tablo değerlerini, hücre değişkenleri de satır değerlerini geçersiz kılar:

{| style="background:yellow; color:green"
|- 
| abc
| def
| ghi
|- style="background:red; color:white"
| jkl
| mno
| pqr
|-
| stu
| style="background:silver" | vwx
| yz
|}

çıktısı:

abc	def	ghi
jkl	mno	pqr
stu	vwx	yz

w:HTML 4.01 de 16 tanımlı renk olup onaltılı sistemdeki değerleri şöyledir:

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

• Bütün renk kodlarına buradan ulaşılabilir

Genişlik, yükseklik

Bütün tablonun genişlik ve yüksekliğinin yanısıra satır yüksekliğini de belirlemek mümkündür. Sütun genişliğini belirlemek için, sütunda yer alan herhangi bir hücrenin genişliğini belirlemek yeterlidir. Eğer tüm sütunlar için bir genişlik değeri ve/veya satırlar için yükseklik değeri belirlenmemişse sonuçlar belirsiz olup tarayıcıya göre değişiklik gösterebilir.

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

çıktı olarak:

abc	def	ghi
jkl	mno	pqr
stu	vwx	yz

Yerleştirme

Tablodaki tüm içeriğin yeri tek bir değişkenle değilse de, tablonun kendisinin, bir sıradaki tüm içeriğin, ve bir hücredeki içeriğin yeri ayarlanabilir, (bkz. m:Template talk:Table demo). Büyük fontlar kullanıldığında sayfa görüntülemeyi bozduğundan, tablonun yerini ayarlamak için hiçbir durumda "float" (kaydırma) kullanılmamalıdır.

Mélange

Burada, tablo yapımında daha çok seçenek sunan, daha ileri seviyede bir örnek görmekteyiz. Yaptığınız tabloda bu ayarlarla oynayarak etkilerini görebilirsiniz. Bu tekniklerin hepsinin her durumda uygun olduğu anlamı çıkarılmamalıdır. Örneğin, arka fonlarda renklendirme yapabiliyor olmak her zaman iyi bir fikir olmayabilir. Tablolarınızda biçimlemeyi mümkün olduğunca sade tutmaya özen gösteriniz. Unutmayınız ki diğer insanlar da bir gün aynı makaleyi düzenlemek isteyebilirler. Gene de bu örnek nelerin yapılabileceğini gösteren güzel bir örnektir.

Kaynak kodu

{| border="1" cellpadding="1" cellspacing="0" align="center"
|+'''Örnek bir tablo'''
|-
! style="background:#efefef;" | İlk başlık
! colspan="2" style="background:#ffdead;" | İkinci başlık
|-
| sol üst
| 
| rowspan=2 style="border-bottom:3px solid grey;" valign="top" |sağ
|-
| style="border-bottom:3px solid grey;" | sol alt
| style="border-bottom:3px solid grey;" | orta alt
|-
| colspan="3" align="center" |
{| border="0"
|+''Tablo içinde tablo''
|-
| align="center" width="150px" | [[Resim:wiki.png]]
| align="center" width="150px" | [[Resim:wiki.png]]
|-
| align="center" colspan="2" style="border-top:1px solid red; border-right:1px solid red; border-bottom:2px solid red; border-left:1px solid red;" |
İki VikiKaynak logosu
|}
|}

Çıktısı

İlk başlık

İkinci başlık

sol üst

sağ

sol alt

orta alt

Tablo içinde tablo

İki VikiKaynak logosu

Gelişmiş örnek

{| align=right border=1
| Hücre 1, satır 1 
|rowspan=2| Hücre 2, satır 1 (ve 2) 
| Hücre 3, satır 1 
|- 
| Hücre 1, satır 2 
| Hücre 3, satır 2 
|}

Hücre 1, satır 1	Hücre 2, satır 1 (ve 2)	Hücre 3, satır 1
Hücre 1, satır 2		Hücre 3, satır 2

Görüldüğü gibi tablo sağa dayalı olarak belirmiştir.

Tablo içinde tablo

{| border=1
| α (alfa)
| align="center" | hücre 2
{| border=2 style="background-color:#ABCDEF;"
|iç içe
|-
|tablo
|}
|valign="middle" | tekrar orijinal tablo
|}

çıktı olarak iki tabloyu iç içe verir:

α (alfa)

hücre 2 iç içe tablo

tekrar orijinal tablo

İç tablo satırbaşından başlamak zorundadır.

COLSPAN ve ROWSPAN: birarada kullanım

{| border="1" cellpadding="5" cellspacing="0"
|-
! Sütun 1 || Sütun 2 || Sütun 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
|}

Sütun 1	Sütun 2	Sütun 3
A	B
	C	D
E	F
G	H	I
	J	K
	L

Diğer tablo formatları

MediaWiki'nin desteklediği diğer tablo söz dizimi türleri:

1. XHTML
2. HTML ve wiki <td> söz dizimidir.

Şimdilik her üçü de MediaWiki tarafından desteklenmekte ve geçerli HTML çıktısı oluşturmaktadır. Çubuk söz dizimi, HTML'ye daha alışkın kişiler için öyle olmasa da, en basit olanıdır. Öte yandan, HTML ve wiki <td> söz diziminin, özellikle elde taşınabilip internete erişimi olan cihazlarda olmak üzere, gelecekte tarayıcılar tarafından desteklenmeye devam edilip edilmeyeceği belirsizdir.

Ayrıca bakınız HTML element#Tablolar. İlaveten, thead, tbody, tfoot, colgroup, ve col elementlerinin şu an için MediaWiki tarafından desteklenmediğini unutmayınız. (MediaWiki'de desteklenen kodlar).

Karşılaştırma

XHTML

HTML & Wiki-td

Wiki-çubuk

Tablo

<table></table>

<table></table>

{| değişkenler 
|}

Başlık

<caption></caption>

<caption></caption>

|+ başlık

Satır

<tr></tr>

<tr>

|- değişkenler 

Veri hücresi

<td>hücre1</td>
<td>hücre2</td>

<td>hücre1
<td>hücre2

| hücre1
| hücre2

Veri hücresi

<td>hücre1</td> <td>cell2</td> <td>hücre3</td>

<td>hücre1 <td>hücre2 <td>hücre3

|hücre1||hücre2||hücre3

Başlık hücresi

<th></th>

<th>

! başlık

Örnek tablo

1	2
3	4

<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
|}

Örnek tablo

1	2
3	4
5	6

<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 
|}

Artıları

Herhangi bir XHTML düzenleyicisi ile ön izleme ve hata ayıklama yapılabilir

---

Daha kolay okunabilmesi için düzenlenebilir

---

Yaygın şekilde bilinir

Herhangi bir XHTML düzenleyicisi ile ön izleme ve hata ayıklama yapılabilir

---

Daha kolay okunabilmesi için düzenlenebilir

---

Yaygın şekilde bilinir

---

XHTML den daha az yer tutar

Kolay yazılır

---

Kolay okunur

---

Az yer tutar

Eksileri

Zahmetlidir

---

Çok yer kaplar

---

Çabuk okunması zordur

HTML de deneyimsiz kişiler için karmaşıktır

---

Yapısı zayıftır

---

Sınırlandırmalar zayıftır

---

Genellikle tuhaf görünüşlüdür

---

Gelecekte tarayıcı desteği olmayabilir

Alışılmamış söz dizimi

---

Katı yapı

---

Girintili yazıma elverişli değil

---

Metinler (HTML etiketlerindekilere benzeyen) bazıları için, çubuk serilerini, artı işaretlerini, ünlem işaretlerini, vs. okumaktan daha kolay olabilir.

XHTML

HTML & Wiki-td

Wiki-pipe

Oluşturulan HTML açısından çubuk söz dizimi

Çubuk söz dizimi, Magnus Manske tarafından geliştirilmiş olup HTML nin yerine çubukları (|) yerleştirir. HTML tablolarını, çubuk söz dizimi tablolarına çeviren bir çevrimiçi scripte buradan ulaşabilirsiniz.

Çubuklar, değişkenleri içerikten ayırmanın veya tek bir satırdaki hücreleri birbirinden ayırmak için || kullanmanın dışında, yeni satırdan başlamalıdır. Değişkenler isteğe bağlıdır.

Tablolar

Bir tablo .... {| ''params'' |} ile tanımlanır ve bu da <table ''değişkenler''>Buraya formatlanmamış metni yazınız </table> a eşittir.

Dikkat: {| ile değişkenler arasına boşluk koymazsanız ilk değişken dikkate alınmaz.

Satırlar

<tr> etiketler ilk satır için ototmatik olarak üretilirler. Yeni bir satıra başlamak için

|-

kullanınız. Bunun da çıktısı

<tr>

olacaktır. Değişkenler:

|- değişkenler

şeklinde ilave edilebilir. Bunun da çıktısı

<tr değişkenler>

olacaktır.

Not:

• <tr> etiketler ilk <td> eşdeğerinde otomatik olarak açılacaktır
• <tr> etiketler ilk <tr> ve </table> eşdeğerinde otomatik olarak kapanacaktır

Hücreler

Hücreler ya:

|hücre1
|hücre2
|hücre3

şeklinde ya da:

|hücre1||hücre2||hücre3

şeklinde oluşturulurlar, ki her ikisi de:

<td>hücre1</td><td>hücre2</td><td>hücre3</td>

ile aynı olup burada "||" , "newline" + "|" a karşı gelmektedir.

Hücrelerdeki değişkenler:

|değişkenler|hücre1||değişkenler|hücre2||değişkenler|hücre3

şeklinde kullanılabilirler ve çıktı da

<td değişkenler>hücre1
<td değişkenler>hücre2
<td değişkenler>hücre3

şeklinde olur.

Sütun başlıkları

Açılışta "|" yerine "!" kullanılmasının dışında aynı TD gibi çalışır. "||" yerine "!!" kullanılabilir. Ancak değişkenler gene "|" kullanırlar, örneğin: !değişkenler|hücre1

Şekil alt yazısı

Bir <caption> etiketi

|+ Şekil alt yazısı

ile yaratılır ve bu da

<caption>Şekil alt yazısı</caption>

çıktısını verir. Aynı zamanda:

|+ değişkenler|Şekil alt yazısı

değişkenleri de kullanabilirsiniz ve bu da

<caption değişkenler>Şekil alt yazısı</caption>

çıktısını verir.

Tablonun yanında metin

(Etkilerini görebilmek için, tarayıcınızın font büyüklüğünü arttırmanız veya azaltmanız, ya da tarayıcı pencerenizin genişliğini değiştirmeniz gerekebilir.)

table kodundan sonraki metnin, tablonun solunda görünmesini sağlamak için align=right komutunu kullanabilirsiniz.

5*3 Çarpım tablosu

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

işte metin, 5*3 çarpım tablosundan sonra hemen burada başlamaktadır text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text artık bu kadar metin yeter text text text

Ancak, tablonun etrafını sarmalamak yerine üstüne binebileceği için buraya ön-formatlanmış metin koymayınız.
Bundan kaçınmak için <br style="clear:both;">: kullanınız.

4*3 Çarpım tablosu

×	1	2	3
1	1	2	3
2	2	4	6
3	3	6	9
4	4	8	12

işte metin, 4*3 çarpım tablosundan sonra hemen burada başlamaktadır... xt text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text this ve bu da metnin sonu, şimdi de açılmış BR geliyor:

görüldüğü gibi ön-formatlanmış metin, ancak tablo bittikten sonra başlayabiliyor xt text text text text text 

Tablonun solda görünmesini sağlamak için align=left komutunu kullanabilirsiniz. Böylece takip eden metin (belki biraz fazlaca yakın olmakla birlikte) tablonun sağında kalacaktır :

2*3 Çarpım tablosu

×	1	2	3
1	1	2	3
2	2	4	6

işte metin, 2*3 çarpım tablosundan sonra hemen burada başlamaktadır text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

Tablo, şekil veya metin etrafında boşluk

1×1 çarpım tablosu örneğindeki gibi bir tablonun, bir şeklin, veya metnin etrafında, "hücre besleme" (cellpadding) kullanarak boşluk yaratmak için:

Çarpım tablosu

×	1	2	3
1	1	2	3
2	2	4	6

text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

kutu içinde metin

text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text TeXt text text text text text text text text text text text text text text text text text text text text text text text text

Kolon genişliğinin ayarlanması

Bu örneği, sütun genişliklerini, hücrelerdeki en geniş metine göre ayarlanmış genişliği kabul etmeyip, kendi isteğinize göre belirlemek istediğinizde kullanabilirsiniz. Metnin etrafının zorlanarak sarılışına dikkat ediniz.

{| border="1" cellpadding="2"
!width="50"|Adı
!width="125"|Rengi
!width="125"|Modeli
|-
|Porsche
|Kırmızı
|2009
|-
|Lamborghini
|Buz beyazı
|2009
|}

Adı	Rengi	Modeli
Porsche	Kırmızı	2005
Lamborghini	Buz beyazı	2004

Değişkenlerin ayarlanması

Değişkeninizi hücrenin başlangıcında, ardından tek bir çubuk gelecek şekilde ekleyebilirsiniz. Örneğin, width=300px| komutu, o hücrenin genişliğini 300 piksele ayarlayacaktır. Birden fazla değişken ayarlamak için, her biri arasında bir boşluk bırakınız.

Wikipedia kodu

{|
|-
| bgcolor=red|hücre1 || width=300px bgcolor=blue|burası hücre2 || bgcolor=green|hücre3
|}

İnternet tarayıcınızda nasıl görünür

hücre1

burası hücre2

hücre3

Ondalık noktasının hizalanması

Bir sütundaki sayıların, ondalık noktasına göre hizalanması şöyle yapılır:

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

çıktısı:

432	.	1
43	.	21
4	.	321

Daha kolay durumlarda, tablo özelliği bir kenara bırakılır ve satıra boşlukla başlanır. Takibeden sütunlardaki sayıların olmayan haneleri için boşluk kullanılarak sayılar hizalanır.

432.1
 43.21
  4.321

Tarz şablonları

Bazı kullanıcılar, tablo tarzlarını daha kolay belirleyebilmek için şablonlar geliştirmişlerdir. Yapmanız gereken, {| komutundan sonra bunlardan size uygun olan tarz şablonunu eklemektir. Böylece hem tablo formatlarının bütünlüğü bozulmamış olur, hem olası bir problem halinde şablonda yapılacak tek bir değişiklikle problem halledilebilir, hem de o şablonu kullanan tüm tabloların görünümü iyileştirilebilir. Örneğin;

Çarpım tablosu

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

'nun çıktısı:

Çarpım tablosu

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

şeklinde olur.

Tüm bu şablonlar, burada olduğu gibi, tek bir yerde organize edilmeli ve listelenmelidir.

Galeriler

Galeri özelliğinin bir yan ürünü olarak, galeri etiketi kullanarak tablo yapmak ta mümkündür. Ancak metin bir bağlantı içeriyorsa tüm metin iptal olur.

<gallery>
Drenthe
Flevoland
Friesland
Gelderland
Groningen
Limburg
North Brabant (capital: [[Den Bosch]]) 
North Holland
Overijssel
South Holland
Utrecht
Zeeland
</gallery>

çıktısı:

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

Ayrıca bakınız

• basitleştirilmiş tablo söz dizimi
• wiki biçemli tablolar
• w:en:User:Dcljr/Tables

örnekler:

• • Satranç tahtası
  • Go tahtası
  • Monopoly tahtası
  • 8x8 kare pentomino örneği

Dış bağlantılar

• HTML tablolarını wikiye dönüştürücü adresi cnic.org
• Bu adres virgülle ayrılmış değerler (CSV) formatını çubuk söz dizimi formatına dönüştürür. Excel vs. türünde yazılmış tablolarınızı bu adresi kullanarak dönüştürebilirsiniz. (Fazla bilgi için tıklayınız.)
• HTML tablolarını wikiye dönüştürücü adresi wackyboy.com
• HTML tablolarını wikiye dönüştürücü adresi uni-bonn.de
• HTML tablolarını wikiye dönüştürücü adresi diberri.dyndns.org
• pywikipediabot (HTML tablolarını wikiye dönüştürebilir)