Forum İstatistiklerine Estetik Görünüm Katın

[Adil S.]

Selamınaleyküm;

Yapımcı:jony

Öncelikle Kodları Uygulamadan önce ne işe yaradığını söyleyelim.Bu kodları uyguladıktan sonra en alttaki konu,mesaj,üye sayıları daha estetik bir görünüm içine girecekler.Resimde Gördüğünüz renklerle css yardımıyla oynabileceksiniz.Yani herşey size Kalmış.Önce Bir Resmimizi Görelim


Evet Beğendiyseniz Kuruluma Geçelim Ancak Global.css ile index_boardstats yedeklerini alalım

Yedekleri Aldıktan sonra kuruluma başlıyalım

1.Adım Admin Paneli-Temalar & Şablonlar-Şablonlar-Kullandığınız Tema-Ana Sayfa - [index] Şablonlar-index_boardstats açınca şu kodu bulalım

Kod: Tümünü Seç Tümünü Kopyala

{$forumstats}

Bu kodu silelim

Aşağıdaki Kodu Yine Aynı Şablonun en alt kısmına ekleyelim ve şablonu kaydedip kapatalım

Kod: Tümünü Seç Tümünü Kopyala

<div style="text-align: center">
<span class="stats">{$stats['numposts']}</span><span class="statstext"> Posts</span>
<span class="stats">{$stats['numthreads']}</span> <span class="statstext">Threads</span>
<span class="stats">{$stats['numusers']}</span> <span class="statstext">Members</span>
</div>
<br />

İkinci Adım Kullandığınız Temanın css kalıplarından global.css açalım ve Gelişmiş Düzenle Diyerek Devam Edelim

Kod: Tümünü Seç Tümünü Kopyala

.thead a:hover, .thead a:active {
    color: #ffffff;
    text-decoration: underline;
}

Bu kodu arayıp bulduktan sonra aşağıda vereceğim kodları bu kodun altına ekleyeceksiniz.

Altına Ekle

Kod: Tümünü Seç Tümünü Kopyala

.stats {
-webkit-box-shadow: inset 20px 58px 20px 70px #538297;
-moz-box-shadow: inset 20px 58px 20px 70px #538297;
box-shadow: inset 20px 58px 20px 70px #538297;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
margin-left:50px;
color: #ffffff;
font-size: 17px;
padding: 3px 8px;

}
Yukarda Eklenen Kodun Altına Ekle
Kod:
.stats:hover {
color: #80d0cd;
-webkit-transition: color 200ms ease-in;
-moz-transition: color 200ms ease-in;
-o-transition: color 200ms ease-in;

}

Değişikler Bitmiştir.Bütün Bunlar Css3 Yapısı kullanırak yapılmıştır. Beğendiyseniz veya kullanıcaksınız teşekkür için rep esirgemeyin :D

[Tunis]

Tesekkurler :)

[Adil S.]

Rica ederim.