Forumlari.Net

Anlatım subsilver2 teması üzerinedir ama tabanları aynı olduğu için ufak farklılıklar vardır. Bu tema üzerinde düzenlemeyi yapabilen diğer temalar üzerinde de rahatlıkla yapabilir.

Css içindeki önemli olan kısmları anlatacağım bazı yerleri yani fazla oynamamanız gereken yerleri geçeceğim

İlk önce genel sayfa stilini belirlememiz lazım,

body {
/* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
color: #323D4F;
background-color: #FFFFFF;
font-size: 62.5%; /* This sets the default font size to be equivalent to 10px */
margin: 0;

Sayfa stilinin olduğu yani arka plan ve gövdenin olduğu kısım;

background-color: #FFFFFF; arka plan rengidir.
color: #323D4F; forum açıklamaları içindeki yazı rengidir.

Eğr arka plana resim veya herhangi bir görüntü ilave etmek isterseniz; background-image: url('RESİM LİNKİ'); Bunu body kısmındaki kodlar içine ilave etmeniz sorununuzu çözecektir.

Eğer arka plana görüntü ilave ederseniz renk kodunuda görüntüye göre ayarlayın, görüntünün olmadığı yerde arka planınız veya sayfa stiliniz farklılık göstermesin.

#wrapheader {
min-height: 120px;
height: auto !important;
height: 120px;
/* background-image: url('./images/background.gif');
background-repeat: repeat-x;*/
/* padding: 0 25px 15px 25px;*/
padding: 0;

Oturumu kapat, öm.,Pano kılavuzu vb. başlık kısmı dahil olduğu kısımdır.

#wrapcentre {
margin: 15px 25px 0 25px;

forumun genel çerçevesidir, Bu kısma renk kodları ilave ederek boyut ile birlikde farklılıklar yaratabilirsiniz.

#wrapfooter {
text-align: center;
clear: both;

Forum veya sayfanın en altında bulunan yönetim panelinin olduğu kısımdır. Bu kısımdada ufak oynamalar yapabilirsiniz. sola veya sağa geçirip çerceve içine alabilirsiniz.

#wrapnav {
width: 100%;
margin: 0;
background-color: #ECECEC;
border-width: 1px;
border-style: solid;
border-color: #A9B8C2;

Bu kısımda fazla oynama yapmanıza gerek yoktur.

#logodesc {
margin-bottom: 5px;
padding: 5px 25px;
background: #D9DFE4;
border-bottom: 1px solid #4787A7;

Burası kod içine logomuzu koyduğumuz kısımdır. logomuzu herhangi bir resim sitesinden upload edip bu kısma kayabiliriz, tabiki bu kısmada background-image: url('RESİM LİNKİ'); ilave edeceksiniz, logo boyutu yani uzunluğu 1000px civarında olursa forum üstüne tam oturur.
ayrıca bu kısımda logomuza göre yükseklik vermek için height: 150px; kısmını ilave ederek logo boyutunu ayarlarız.piksel ayarlarını her zaman değiştirebiliriz.

#menubar {
margin: 0 25px;
}

#datebar {
margin: 10px 25px 0 25px;
}

Kullanıcı paneli ve saat kısmının olduğu yerdir.

Tema içindeki önemli olan kısımları elimden geldiğince anlatacağım için bazı yerleri direk geçeceğim. /* Text
--------------------- */
alanı içinde

.postauthor {
color: #000000;
}

.postdetails {
color: #000000;

Topikler içerisindeki Kullanıcı Adı , Profil bilgilerinin olduğu kısımdır.

/* Tables
------------ */
th {
color: #71DD8D;
font-size: 1.1em;
font-weight: bold;
background-color: #006699;
background-image: url('./images/cellpic3.gif');
white-space: nowrap;
padding: 7px 5px;

Bu kısım Forum, Konu, İleti, Son iletinin olduğu kısımdır. celpic rengine göre arka plan rengini,yani celpic altında gözükecek rengi "background-color: #006699;" celpic üzerindeki yazı rengi "color: #71DD8D;" yazı büyüklüğü,font büyüklüğü ayarı "font-size: 1.1em;"

.tablebg {
background-color: #A9B8C2;

Forum içerisindeki bölümleri ayıran ince çizgilerin olduğu kısımdır, stile göre ayarlama yapabilirsiniz.

.catdiv {
height: 28px;
margin: 0;
padding: 0;
border: 0;
background: white url('./images/cellpic2.jpg') repeat-y scroll top left;
}
.rtl .catdiv {
background: white url('./images/cellpic2_rtl.jpg') repeat-y scroll top right;
}

.cat {
height: 28px;
margin: 0;
padding: 0;
border: 0;
background-color: #C7D0D7;
background-image: url('./images/cellpic1.gif');
text-indent: 4px;

Bu kısımda kategori kesimlerinin olduğu kısımdır. Burdaki celpic boyutunun sağ taraf için 300*30px civarında olmasına dikkat edin , 300px dek küçük olan celpicler yani ara çubuk sağ tarafdaki kısmı tamamlamamaktadır.

.row1 {
background-color: #ECECEC;
padding: 4px;
}

.row2 {
background-color: #DCE1E5;
padding: 4px;
}

.row3 {
background-color: #C0C8D0;
padding: 4px;
}

.spacer {
background-color: #D1D7DC;
}

hr {
height: 1px;
border-width: 0;
background-color: #D1D7DC;
color: #D1D7DC;
}

Bu kısım row1, row2, row3 forum açıklamalarının,konu, ileti, son iletilerin olduğu kısımın zemin renklerini ayarlar.

/* Links
------------ */
a:link {
color: #006597;
text-decoration: none;
}

a:active,
a:visited {
color: #005784;
text-decoration: none;
}

a:hover {
color: #29AB4A;
text-decoration: underline;
}

a.forumlink {
color: #006699;
font-weight: bold;
font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
font-size: 1.2em;
}

a.topictitle {
margin: 1px 0;
font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
font-weight: bold;
font-size: 1.2em;
}

a.topictitle:visited {
color: #5493B4;
text-decoration: none;
}

th a,
]th a:visited {
color: #71DD8D !important;
text-decoration: none;
}

th a:hover {
text-decoration: underline;
}

Bu kısımdan linklerimizin renk ayarlarını, farenin üzerine geldiği zaman alacağı hali ayarlar, bu kısımda th a:visited { aynı zamanda üyeler sayfasındaki link rengidir.burdaki renk kodunun tables de ayarladığımız renk kodu ile aynı olmasına dikkat edin.

.quotetitle, .attachtitle {
margin: 10px 5px 0 5px;
padding: 4px;
border-width: 1px 1px 0 1px;
border-style: solid;
border-color: #A9B8C2;
color: #333333;
background-color: #A9B8C2;
font-size: 0.85em;
font-weight: bold;

Bu kısımda alıntı satırlarının renk ve yazı ayarlarını yaparız

tesekkurler abı guzel paylasım!

süpersin yaaaaa

Teşekkürler eline sağlık.

http://www.tatlimekan.forumlari.net

Anlatım İçin Sağol

necati abi çok güzel anlatmışsın hepsini takip ettim ama arka plan rengi değişmiyor beyaz kaldı


buranın mesela arka planı beyaz nasıl değiştireceğim? subsilver2 tema

peki bu temaları nereden alıp editleyeceğiz?O konuda yardımcı olursan sevinirim

bir yerden almana gerek yok...
Stiller>Temalar'a griyorsun...İstediğin temanın karşısında düzenle yazar oradan girip anlatılan şekilde editleme yapabilirsin

Zaten temalarda var sen sadece renkleri vb. şeyleri değiştireceksin..

hayali yazdı::D bir yerden almana gerek yok...
Stiller>Temalar'a griyorsun...İstediğin temanın karşısında düzenle yazar oradan girip anlatılan şekilde editleme yapabilirsin

ya mesela siteme reklam banneri yada kendi bannerimi koymak istiyorum onu nasıl yapacağım

sitede arama yap bununla ilgili konular var

hayali yazdı:sitede arama yap bununla ilgili konular var

aradım da bulamadım sen biliyosan linklerini koyabilir misin kardeş?

Necati abi Logo Resimi bir türlü değişmiyor neden?.

---- EDIT ----

Css olarak
Logodest mı ne oraya eklıyorum olmuyor.

subsilver2'de logonu, logodesc yazan kısma koyacaksın, background-image: url(RESİM LİNKİ); Bu şekilde logodesc kısmına ilave edersen olur.

ilave ettiğimizde bazen ilk anda göstermeyebiliyor, forumdan dışarı çık tekrar gir.

Öyle yapıyorum ama olmuyor.
Tema editlemeye çalıştım.Karma karışık oldu:D
Ama boza boza öğrenicez:D
Neyse yarın tekrar denerim.
Sırf tema için deneme sitesi açtım.
Teşekkürler Necati Abi.