iceblue-dizayn / WEB TASARIM - Ekstralari Düzenle

Bedava-Sitem Ekstralarini Düzenlemek :

Bütün Bedava-Sitem- Ekstralarinin " Ekstralardan önce Metin" Alani vardir.
O bölüme istenilen CSS-Kodlarini ekliyoruz.

1.Adim : "style-tag" eklemek

Sitene giris(login) yap
sonra "Ekstralari düzenle"
Herhangi bir Ekstrayi seciniz
Sayfa simdi düzenlemek icin hazir durumda
su Alana bakiniz "....önceki Metin"
style-tag ekleyiniz
<style type="text/css">

</style>

Istediginiz CSS-Kodunu her zaman --> </style> «´dan ÖNCE ekleyiniz!

Formular Alanini düzenlemek :

Bedava-Sitemde su Formular Alanlari vardir :

Iletisim Formu
Ziyaretci Defteri
bir diger Ekstra "Yorumlar"
"Top liste" "Link listesi"
Kodlar bu Alana eklenecektir: Ekstadan önceki Metin

Formular kaynak Kodda böyle basliyor <form method="...
Bu formu CSS ile düzenleyebiliriz :

form {
width: 440px;
padding: 20px;
background-color: #D9D9D9;
background-image: url(RESIM-LINKI);
background-repeat: repeat-x;
border: 1px solid #B9B9B9;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px; }

Formlar cesitli Yükseklikleri vardir. Ve bu aktive ettigimiz Giris-Alanlarina baglidir.
Bir Arkaplan yapmadan önce: "Ekstralari degistir" Alaninda Giris-Alanlarinin genisligini tespit etmemiz gerekiyor.
Ve Giris-Alanlarinin sayisini belirlememiz lazim. Ondan sonra Arkaplan icin kalan Genisligin ne kadar oldugunu görebiliriz.

Kod hakkinda Aciklamalar :

width: 440px;
padding: 20px;
background-color: #D9D9D9;
background-image: none;
background-repeat:
border: 1px solid #c9c9c9;
-moz-border-radius:
-webkit-border-radius:
border-radius:

Genislik : 440 Piksel. Düzenleyebilirsiniz.
20 Piksel Cerceve ve Metin arasindaki Mesafe
#D9D9D9; yerine (Gri) uygun olan Rengi seciniz.
ya da Resim-Linki (Parantez icinde ekleyiniz.
repeat-x; Resim saga dogru tekrarlaniyor
Cerceve Kalinligi / Cerceve Cesidi / Cerceve Rengi
Mozila Tarayicisi icin yuvarlanmis Köseler
Safari ve Google Chrome Tarayicilari icin yuvarlanmis Köseler
CSS3 yetenekli Tarayicilar icin yuvarlanmis Köseler

Giris- Alani :

Bu Alana Ziyaretciler Mesajlarini yazmaktadir.
Giris-Alani olarn Ekstralarda "Top liste, Ziyaretci Defteri, Iletisim Formu ve Link listesi" de düzenlenebilir.

Bunlara textarea deniliyor. Buraya kendinize ait olan Arkaplaninizi ekleyebilirsiniz. Lütfen dikkat ediniz: Arkaplan, Giris Alanlarinin büyüklügünün aynisi olmasi gerekmektedir.
O yüzden ilkönce Ayarlarda, Giris-Alanlarinin hangi Genisligi almasini belirleyiniz.

"Ekstralari degistir"
Istenilen Ekstrayi seciniz
Simdi Ekstra düzenlenmek icin aciktir.
Sari dügmenin üzerine "Gelismis Ayarlari göster" ´e tiklayiniz.
Giris Alanlarinin Genisligini (gerekirse Yüksekligini de) belirleyiniz.
kaydet

Eklenecek Alan "Ekstradan önceki Metin" :
Örnegi Ziyaretci Defterindeki Alan : "Ziyaretci Defterinden önceki Metin"

textarea {
color: #000000;
font-size: 14px;
background-color: #XXXXXX;
background-image: url(Resim-Linki);
background-repeat: repeat-x; }

Kod Hakkinda Aciklamalar :

color: #000000; = Haber Alanindaki Metin Rengi
font-size: 14px; = Metin Büyüklügü
background-image: url(URL); = Resim Linki
background-repeat: repeat-x; = Resim sadece saga dogru tekrarlaniyor.
background-repeat: repeat-y; = resim sadece asagi dogru tekrarlaniyor.
background-repeat: no-repeat; = Resim tekrarlanmiyor.

Ziyaretci Defteri Bölümünde (Ekstralari degistir → Ziyaretci Defteri) Alani altinda; Alanin Büyüklügünü ayarlayabilirsiniz. Yükseklik ve Genislik.
Ondan sonra uygun olan bir Resim seciniz.

Ziyaretci Defteri- Kayitlarini düzenlemek :

-Ziyaretci Defterindeki kayitlar %80 genisliginde Tabeleye göre yerlestiriliyor.
- %80 genisligindeki Tabeleyi CSS yoluyla düzenleyebiliriz.

"Ziyaretci Defterinden önceki Metin"

table[width="80%"] {
width: 480px;
margin: auto;
padding: 20px;
background-color: #XXXXXX;
background-image: url(Resim-Linki);
border: 1px solid #c9c9c9;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px; }

Kod hakkinda Aciklamalar :

margin: auto;
padding: 20px;
background-color: #XXXXXX;
background-image: none;
border: 1px solid #c9c9c9;
-moz-border-radius:
-webkit-border-radius:
border-radius:

Kayitlar ortali bir sekilde hizalaniyor.
Metin ve Cerceve arasinda kalan 20 Piksellik bir Mesafe
statt der #XXXXXX; yerine , Baska bir Renk seciniz.
ya da Arkaplan (Resim- Linki) Parantez icinde ekleyiniz.
Cerceve Kalinligi / Cerceve Cesidi / Cerceve Rengi
Mozilla Tarayicisi icin yuvarlanmis Köseler
Safari und Google Chrome Tarayicilari icin yuvarlanmis Köseler
CSS3 yetenekli Tarayicilar icin yuvarlarnmis Köseler

Arkaplan Hakkinda :

Ziyaretci Defterindenki Kayitlarin degisik Yükseklikleri vardir. Kimisi uzun, kimisi ise kisa Kayitlardan olusuyor. Eger Metin, Resim Yüksekligini asarsa, o zaman Resim tekrarlanacaktir :

background-repeat: repeat-x; = Resimi sadece Saga dogru tekrarlamak
background-repeat: repeat-y; = Resimi sadece Asagi dogru tekrarlamak
background-repeat: repeat; = her iki Yöne dogru tekrarlamak
background-repeat: no-repeat; = Resimi tekrarlamamak.

Ziyaretci Defterindeki - Kendi Yorumarini düzenlemek :

Ziyaretci Defterinde bulunan Kayitlar hakkinda "Ekstralari düzenle → Ziyaretci Defteri → Yorum |

Yorumlarinizi Renkli bir sekilde de ayarlayabilirsiniz/ düzenleyebilirsiniz.

"Ziyaretci Defterinden önceki Metin"

.Yorum {
width: 350px;
padding: 10px;
color: #000080;
font-size: 12px;
background-color: #FFFFB2;
border: 1px solid #B9B9B9;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px; }

Ziyaretci Defteri -Kayitlarini artik böyle yorumlayacaksiniz:
- "Ekstralari Düzenle"
- Ziyaretci Defterinin seciniz
- "Kaydi degistir"
- Herhangi bir Kayidi seciniz
- Yorum Alanina bunu yaziniz:

<div class="Yorum"> Buraya Yorumunuzu yaziniz </div>

Metin Rengi, Metin Büyüklügü, Boxlarin Arkaplan Rengini ; 1. Kodda belirleyiniz,
color / font-size / background-color vs. ("Ziyaretci Defterinden önceki Metin" Alaninda).
-moz-border-radius: 8px; = Mozilla Tarayicisi icin yuvarlanmis Köseler
-webkit-border-radius: 8px; = Safari- und Google Chrome Tarayicilari icin yuvarlanmis Köseler

En son: Ziyaretci Defterindeki Ayirma-Cizgileri

Ziyaretci Defteri ve Ayirma cizgilerinin temiz olmadigini Mozilla Tarayicisi ile daha ayrintili olarak görebiliriz.

Bunu CSS-Komutu iler belirleyebiliriz. margin-top = Yukariya dogru Dis-Mesafe . margin-bottom = Asagiya dogru Dis-Mesafe .

Ayirma Cizgisinden yukariya ve asagiya dogru 10 Piksel secelim;
CSS-Kodunu (ilköncelikle) Ziyaretci Defterinden önceki Metin Alanina ekleyiniz:

hr {
margin-top: 10px;
margin-bottom: 10px; }

Ayirma Cizgisi nasil görünmez yapilir?
Kodun icine ek olarak bunu ekleyiniz: visibility: hidden;

Bedava Sitem Ekstrasi "Haberler" ´i düzenlemek:

- "Ekstralari düzenle"
- oradan "Haberler" Ekstrasini seciniz
- Simdi Haberleri düzenleyebilirsiniz
- Yorum Fonksiyonunu Haberler Alaninda deaktive ediniz.
- Haberleri düzenlemek icin Kod : Aciklama: Haberleri düzenlemek

Ipucu :

Eger bircok Kod eklemek istiyorsaniz, Örnek Grafige bakiniz!
Grafigi cok yakinda hazirlayacagiz!