WordPress kullananların belki ilk sürümlerden bu yana en çok rastladıkları uyumsuzluk yazılara eklenen resimlerde meydana geliyor. Bu yazıdaki gibi yazının herhangibir yanına (sol-sağ) hizalanmış bir resim kullanılmak isteniyor. Ancak WordPress yazı editöründe resim eklerken hizalama seçeneği seçilinlce sol veya sağda problem çıkabiliyor. Yani resim yazıdan yukarıda kalıyor, altta kalıyor ve istendiği gibi olmuyor. Daha önceki WordPress sürümünde bu konu ile ilgili herhangibir sorunum yoktu. Yalnız son güncellemeden sonra bende de aynı sorun meydana geldi. Çözümü ise çok basit.
Önceki WordPress sürümünde resim hizalamayı seçtikten sonra kod sekmesinden baktığımızda hizlama kodu şu şekildeydi:
<img src="resim" align="left">
Ancak yeni sürümde hizalama kodu, seçeneği biraz daha farklı. Yani o da şu şekilde:
<
img src="resim" class="alignleft">
Yani yazı WordPress’in stil dosyalarının birinde “aligleft” adında bir sınıf oluşturularak resim hizalama sağlanıyor. Bu stil dosyası ise wp-admin/css/global.css dosyası. Fakat başta da söylediğim gibi hizalama sorunlu olabiliyor. Şimdi yapacağımız düzeltme çok basit. Kullandığımız tema dosyasının style.css dosyasına şu kodu ekliyoruz:
.alignleft { float: left;}
Eğer resmi sağda görüntülemek istiyorsak left yerine right yazmamız ve yazı editöründe resim hizalamadan sağ seçeneğini işaretlememiz yeterli. Son olarak bu kodu yazdıkdak sonra resim ile yazı arasında boşluk olmayacaktır. Sanki iç içeymiş gibi görünecektir. Bunu da margin değeri ekleyerek çözeceğiz.
.alignleft { float: left; margin:0px 3px 3px 0px;}
Eğer boşluk yeterli gelmezse verdiğimiz margin değerlerinde oynama yaparak istediğimiz hale getirebiliriz.
Benimde başıma gelen bir olaydı bu.Pek fazla önemsemiyordum ama bundan sonra şart oldu.
Açıklayıcı bir yazı olmuş gene teşekkürler.
Gerçekten baş belası bir soruna çözüm getirmişsin teşekkürler Hamdi. Bir şey daha eklemek istiyorum:
Tema dosyanıza yukarıda verilen iki satırı birden eklemeyin. Bunu yaparsan hizalama sorunu çözülmez.
Sadece aşağıdaki satırı css dosyanıza eklerseniz problem çözülecektir.
.alignleft { float: left; margin:0px 3px 3px 0px;}
@hakan yamanoğlu tabiki öyle. Çünkü CSS olarak bir tanesini alıglaması gerekir.
HC bu konuda bir yazı yazmıştı bende o şekilde öğrenmiştim: http://www.hakkiceylan.com/wordpressi-daha-verimli-kullanmak-icin-ipuclari/
yeni temamda buna benzer bir problem yaşamıştım.. resimleri float fonksiyonu ile sağa ya da sola yaslamak isstediğimde sayfayı kaydırıyordu..farklı bir çözümle düzelttim 🙂
Çok iyi olmuş bunu anlatman. Bir ara tema değiştirdiğimde çok uğraşmıştım bunu düzeltmek için.
Teşekkürler sorunumuza çare oldunuz.
.alignleft { float: left; margin:0px 3px 3px 0px;}
Kodunu sola dayalı yazmak için kullandık ve işe yaradı peki aynı yazıda hem sağa hem sola dayalı resimler kullanmak için kullanabileceğimiz bir kod varmı ?
Teşekkürler değerli bilgilerinizi bizlerle paylaştığınız için.
teşekkürler güze blir yazı.
Seiya;
.alignleft { float: left;}
.alignright { float: right;}
iki tanımıda yaz olur.
Yeni bir şey daha öğrencim çok faydalı oldu teşekkürler arkadaşım.
Paylaşım için teşekkürler, biz de nasiplendik sayende 😉
teşekkürler sayenizde bu sorunu çözdüm
Ayarlarla uğraşırken bir ayar yaptım ve sitede herşey sağa yaslandı. sayfa yarım gibi oldu ne yaparsam yapıyim sağ taraf doluymuş gibi. bazı sayfalar sanki yarım. yardıma ihtiyacım var.
Merhaba, teşekkür ederim. Sayenizde bu sorunu çözdüm.
Çok teşekkürler bilgiler için.