Yazan: Programc Tarih: Haz 10th, 2008 | Kategori::
Mybb Eklentiler
Gazetelerdeki gibi yazıların ilk harfi büyük olsun
Gazete okurken(okuyusunuzdur umarım) dikkatinizi çekmiştir paragraflara başlarken ilk harf kocamandır.Bunu birazcık css ile mybb için uygulamak tabikide mümkün;
şimdi isterseniz öncelikle mantığı kavrayalım daha sonra bu kodlamayı mybb için uygulamaya çalışalım;
Örnek;
nayhki
şimdi arkadaşlar yukardaki yazının başlığını hep birlikte büyütelim
öncelikle yazımızı div editketiyle tanımlayalım şöyle ki;
<div class=”ilkharf“>nayhki</div>
div ile tanımladıktan sonra css kodlamasına geçelim 
.ilkharf:first-letter {
font-size:400%;
float:left;
line-height:.8em;
}
yukarıdaki kodlama en basitinden yazımızın baş harfinin boyutunu büyütür şimdi isterseniz buna biraz daha özellik ekleyelim;
yazımızın baş harfi daha janjanlı olması için arka plan atayalım bunuda;
background: url(’skins/gokyuzu/icons/ilkharf.gif’) no-repeat;
no-repeat diyoruz ki arka plan resmimiz birden çok tekrarlanmasın;
birde baş harfimiz birazdaha ayırt edilmesi açısından ona noaml yazımzıdan ayrı bir renk atayalım;
color: #0099FF;
birde unutmadan padding değerini koyalım;
padding:10px 0 0 20px; yeterli olur sanırım hoşunuza gitmezse siz sayıları küçültüp büyütebilrisiniz
şimdi css kdumuzu toplayalım;
.ilkharf:first-letter {
font-size:400%;
float:left;
line-height:.8em;
color: #0099FF;
background: url(’skins/gokyuzu/icons/ilkharf.gif’) no-repeat;
padding:10px 0 0 20px;
}
Not: burda yazıların baş harflerinin büyük olmasını first-letter özelliği sayesinde yapıyoruz
güzel oldu (= şimdi gelelim bizi ilgilendiren kısıma!!!
önemli olan burda mybb’de hangi kodu div ile tanımlıycağımızdır.
mybb’de forumda yazılan mesejlar posbit kalıbında {$post['message']} adlı kodla yerine getirilir. bizde en baÅŸta yazdığımız angelslayer adnın yerine bunu div ile tanımalrsak şöyle ki;
<div class=”ilkharf”>
{$post['message']}
</div>
şeklinde yapıp kaydediyoruz. daha sonra tema düzenleden ek css kısmına gelip;
.ilkharf:first-letter {
font-size:400%;
float:left;
line-height:.8em;
color: #0099FF;
background: url(’skins/gokyuzu/icons/ilkharf.gif’) no-repeat;
padding:10px 0 0 20px;
}
yukarıda css kodunu yapıştırıyoruz
)
