Bir sayfa yazdiniz ama yazilarin bir kismi büyük ve alti çizili bir kismi küçük zar zor okunsun bir kismida
renkli olsun istiyorsunuz.Oysa sayfada yazılar vb hep standart.İşte burada CSS kullanıyoruz. Dreaamveraverda CSS nasıl oluşturulur ?
Açılan kısımda altda ” New CSS rule ” tuşu vardır.Buna tıklıyoruz.
solda görünen pencere açılır.Class oluşturucaz.name kısmına class adını yazıyoruz herhangi birşey olabilir.başına “.” sadece nokta gelmeli! örnekte .s1.define in kısmı için iki seçenekte seçilebilir.Ben farklı dökümanı seçiyorum.Diğerini seçersem css kodlarını aynı dosyada oluşturur.
.s1 classını sanal.css dosyasında oluşturdum. bu css dosyasını yukarıdaki adımdan sonra soruyor.istediğiniz ismi ve kaydedilecek yeri seçmeniz yeterli.
Soldaki pencere açılır. Oluşturacağımız class’ın bütün özelliklerini burada belirleriz. Günümüzde sitenin görsel özellikleri CSS yardımıyla yapılmaktadır.CSS lerde yapılan değişiklikler ile kolayca sitenin çehresi değişebilir. WordPress sitelerde admin panelinde editör kısmında css dosyasıda bulunmaktadır. Orada değişiklik yaparsanız sitenizde değişir.Temanızın değiştirmek istediğiniz özelliklerinide oradan düzenleyebilirsiniz.
Örnek bir dosya hazırladım. Yandakii resimde 5 tane yazı var.sanal.css dosyasıda hemen yanda.oluşturduğumuz her class o dosyanın çindede oluşacak ve o dosyayıda kaydetmeliyiz.
Yukarıdaki örnekte sanal.css dosyasında .s1 clasını oluşturmuştuk.Oluşturduğumuz her class altdaki resimde görüldüğü gibi css kısmında görünür.Özellikleri buradan değiştirebiliriz. İstediğim yazıyı seçiyorum ( sayfanın altında properties penceresinde “style” kısmı var.her class buraya eklenir ) istediğim yazıyı seçtikten sonra buradan istediğim class’ı seçiyorum.Bu sayede o yazı diğerlerinden farklı özellikte oluyor.
soldaki resimde gösterildiği gibi. Kod kısmınada dikkat edin sadece sanalgelisim.com a css uyguladım.
ilk başta gösterdiğim gibi class sayısını arttırdım.5 adet yazı vardı.İlki sayfanın standart özelliğinde diğer 4 yazıya css uyguladım.Resimde görüldüğü gibi farklı farklı yazılar oluşturdum.CSS leri tablolara,resimlere hücrelere vb uygulayabilirsiniz. Örneğin bir class oluşturursunuz ve bunun içine resim eklersiniz.Bu şekilde onlarca resim koydunuz ve daha sonra bir düzenleme ihtiyacı duydunuz tek tek resimlere girmek yerine classı düzenlemek yetecektir. Mesela bu yazıda kiresimlerin kenarlarındaki boşluklar css ile ayarlanmıştır.
Her class oluşumunda sanal.css dosyasında da kodlar otomatikman oluşur.Solda gözüktüğü gibi. WordPress siteniz var ve css ile bir sayfa hazırladınız.Kendi kodlarınızı alıp wordpress css dosyasına kopyalayın yeterlidir yada sitenizin mevcut css kodları üzerinde değişiklik yapabilirsiniz.Tavsiyem önceden kodları kopyalayın.Çünkü css dosyasında yapılacak değişiklikler bütün siteyi etkiler.
Hiç yorum yok: