% Tablolar Olusturmak.
1- Aşama Genel Yapıyı Ayarlayalım
<table border="1" bordercolor="renkkodu" width="818" height="309" bgcolor="windowbg">1- Boder kenarlık cizglilerinin kalınlıgıdır.
a- Boderi class olarak degiştirip 1 yerinede SMF temalarda kenarlıkları olusturan tboder yazabiliriz
2 bordercolor ise kenarlıkların rengidir ama tboderi koydugumuzda onu kaldırmalıyız ve style.css'den tborder rengini ayarlamalıyız tborderda kenar rengi ise boder :0px ( bu kenarın kalınlıgı ) rengi ise #696969 bu koddur direk olarak white red'de yazabiliriz
.tborder
{
padding: 0px;
border: 0px solid #696969;
background-color: #FFFFFF;
}
3 -width tablonun yatay olarak uzunlugudur, SMF temalarda kayma felan oluyor bunun nedeni ise direk girilen rakamlardır 1000 yerine 100% yazmak daha mantıklıdır.
4- height tablonun aşşagı dogru uzunlugudur aynı şekilde direk rakam girmek yerine % oranlı sayılar girebilirsiniz.
5- bgcolor tablonun arka plan rengidir. Style css girerek alabilirsiniz.
Not : 1
Peki Bu tablo yapısını css olusturmak istiyorum derseniz.
<div class="tablodersleri">
css'de ise style.css'de
.tablodersleri
{
width: 100%;
height: 80px;
border: 1px solid #renk;
}Olarak yapabilir dahada geliştirebiliriz
Şimdi tabloda sutunlarımızı yapabilim
<tr>
<td width="100&" height="309">içerik</td>
</tr>aynı şekilde buda width degerini ve height degerini alarak yatay ve aşşagı dogru genişler.
1 - Peki alt altda iki tablo nasıl acabilirim.
<tr>
<td width="100%" height="309">içerik</td>
</tr>
<tr>
<td width="100%" height="309">içerik</td>
</tr>tr acıyoruz ve td ile giriş yapıp sutunumuzun boyutlarını girdikden sonra içerigi girmek için kapatıp td'yi bitiriyoruz.
2- yan yana nasıl 2 tablo koyarım ?
daha demin alt alta koymak için tr kapatıldıkdan sonra koymuştuk. Şimdi ise tek tr taglarını kullanarak yan yana koyduk
<tr>
<td width="100%" height="309">içerik</td>
<td width="100%" height="309">içerik</td>
</tr>Bunu daha fazla yaparak daha cok yan yana tablo koyabiliriz. ama yana uzunlugunu ayarlayınki kaymasın.
ve tablonun kapatılışı
Table ile yaptıysanız mutlaka
</table>eger genel yapıyı css ile yaptıysanız
</div>İle kapatmalısınız sorunlar ve xhtml hatası vermemesi için.
##### Şimdi biraz olayı acalım
Örnegin Bir istatistik yapalım. Boardindex.template.php'ye...
( Board kodlarından bagımsız )
<div class"tablodersleri">
<div class"catbg">Mini İstatistik</div>
<tr>
<td width="100%" height="20%">
', $context['common_stats']['total_topics'], '
</td>
</tr>
</div>Ufak bir istatistik yaptık Toplam Topic sayıcı ?
-- Birden fazla yapıyorum ama alt alt koyamıyorum ?
istatistik veya içerik kodunuz <br /> tagını koyarak satır atlatabilirsiniz
-- Üzerine gelince Cizilmesini istiyorum ?
<li>', $context['common_stats']['total_topics'], ' </li> ekini getirerek yapabilirsiniz.
-- İstatistigimin veya İçerigimin Önüne Resim eklemek istiyorum ? ama xhtmlsiz ?
<img src="', $settings['images_url'], '/resim.gif" alt="doldur" />', $context['common_stats']['total_topics'], ' Şeklinde ekleyebilirsiniz.
ALT'daki doldur yazsını resmin üzerine geldiginde gösterilecek yazıdır.
-- İstatistigimin içerigindeki yazı büyük olsun ?
bunu h degeri bile yapabiliriz SMF yeni sürümlerde kullanmışlar.
<h3>', $context['common_stats']['total_topics'], '</h3>
-* Tablo kodları ile logo yapmak istiyorum ?
Degişen birşey yoktur aslıda,
<table width="818" height="309" bgcolor="windowbg">
<tr>
<td width="100%" height="20%">
<img src="', $settings['images_url'], '/resim.gif" alt="doldur" />
</td>
</tr>
</table>
-- ', $settings['images_url'], '/resim.gif bu ne ya ben bundan birşey anlamadım ? Resim adresi nerde ?
Temanızın images klasöründen resimi ceker kullandıgınız temanın içine resim.gif diye atmalısınız.
-- Koydum ama farklı boyutlarda kayıyor bir Cözüm yokmudur ?
Vardır kullandıgımız tabloya arka plan vererek yapabiliriz. Peki nasıl ?
Tablonun ana yapısında bgcolor="windowbg" demişiz buraya resim adresi verirsiniz
yani bgcolor="', $settings['images_url'], '/resim2.gif" olarak degiştirebilirsiniz.
Bu ÖRNEKLEMELER İLE REKLAM TABLOLARI LOGİN SUTUNLARI LOGO gibi şeyler yapabilirsiniz
Bugünlük bu kadar gün gün bir ileri seviyeye götürecegiz
