Bugün R10′da gördüğüm bir konu ilgimi çekti… Tam eklentisini yazacakken, aklıma güzel bir fikir geldi
Neden eklenti kullanıp, boş yere işlemciyi yoruyoruz ki ?
Aslında olay tam olarak ÅŸu: kopyala yapıştır yapılan resimlerin boyutu büyük geliyor ve siz bunu ayarlayamıyorsunuz… Bunun sonucunda resimler sidebar kısmına taşıyor ve kötü bir görüntü meydana geliyor…
1. Yöntem Anlatımı
Åžimdi eklentisiz çözüm yöntemini takibin kolay olması açısından WordPress Default tema üzerinden anlatacağım…
1. Öncelikle “wp-content/themes/default” dizinine giriyoruz ve index.php dosyamızı bir metin editörü yardımıyla açıyoruz. (Ben Dreameaver kullandım)
2. index.php içerisinde:
<?php the_content('Yazının kalanını okuyun »'); ?>
araması yapıyoruz. Eğer farklı bir tema kullanıyorsanız direk olarak; the_content için arama yapın. Hala bulamamışsanız, the_excerpt için yeniden arayın.
3. Aradığımız satırı bulduğumuzu farzediyoruz. Özellikle şu alanı işaretledim:
<div class="entry">
<?php the_content('Yazının kalanını okuyun &raquo;'); ?>
</div>
Bunun sebebi ise üstteki div katmanının işimize en çok yarayacak şey olması ![]()
Farklı temalar kullanan arkadaşların ise, 2. adımda aradığımız satırı bulduktan sonra; o satırın üstündeki ilk div katmanını bulmaları gerekiyor.
4. Katmanı bulduktan sonra hemen id veya class tanımlanmış mı diye bakıyoruz. ÖrneÄŸimizde class=”entry” olarak belirlenmiÅŸ. Tanımlı class bulamayanlar, yani sadece <div> ile karşılaÅŸanlar, o katmanı örneÄŸimizdeki gibi düzenlesin.
5. Katmanımızı da bulduktan sonra, index.php içerisindeki işimiz bitiyor ve bu dosyayı kapatıyor.
6. Şimdi yine default tema içerisindeki (yada sizin kullandığınız tema içerisindeki) style.css dosyasını bir metin editörü yardımıyla açıyoruz.
7. Dosyanın en alt satırına iniyoruz. Ve bir iki satır boşluk bırakıyoruz. Buraya bir kod ekleyeceğiz ama öncelikle belirtmem gereken yerler var.
- AÅŸağıda yazacağım kodda, “.entry img {” olarak belirlenmiÅŸ alana siz, 4. adımda bulduÄŸunuz katman ismini yazacaksınız. Yani şöyle: “.katmanismi img {”
- uzunluk ve yükseklik diye belirttiğim yerlere sadece sayı yazacaksınız.
8. Kodumuzu eklemeye başlayalım. Ekleyeceğimiz kod:
.katmanismi img {
max-width: <strong>uzunluk</strong>px;
width: expression(this.width > <strong>uzunluk</strong> ? <strong>uzunluk</strong>: true);
max-height: <strong>yükseklik</strong>px;
height: expression(this.height > <strong>yükseklik</strong> ? <strong>yükseklik</strong>: true);
}
Örneğin ben resimin olması gereken maksimum uzunluğu 500px, maksimum yüksekliği ise 300px olsun istiyorum. Yani default temada bu kod şu şekilde olacak:
.entry img {
max-width: 500px;
width: expression(this.width > 500 ? 500: true);
max-height:300px;
height: expression(this.height > 500 ? 500: true);
}
2. Bir örnek ile inceleyelim
Şimdi sitemizde deneyeceğiz, bu yöntemi deneyeceğiz.

Evet resmimizin boyutu bizim istediğimiz (500px) boyuttan büyük. Bakın şimdi aşağıdaki resime ![]()

Şimdi de sitedeki haline bakalım:

Notlar: Resimlerin burada boyutu küçük görünebilir ancak, default temada denenmiÅŸtir. Bu tema üzerinde css dosyalarıyla oynamadığım için, resimler küçültülmüştür…

“WordPress Css ile Resim Küçültme” için 12 Yorum var
Çok TEÅžEKKÜRLER… Denedim ve Oldu…
bu şekilde gönderilen postlar küçültülüp mü yerleştiriliyor yoksa sayfadamı küçük gözüküyor? serverdaki dosyalar orjinal boyutundamı?
sormamın iki nedeni var birisi sayfanın içinde küçültmek bozulmalara neden olabiliyor ikincisi servera yük biniyormu?
şimdi senin sitendeki bu sistemmi semih abi eğer öleyse çok işime yarıyacak
Gercekten cok ihtiyacim vardi..
Paylasim icin tesekkurler
eywallah iÅŸe yaradı tÅŸk…
Benim sitede sistem yok
Ben manuel küçültme yapıyorum
Genelde temaların yazı kısmını hep 600px bıraktığımdan, her tema için düzenlemem gerekmiyor…
Sayfada küçük gözüküyor. Ne yazık ki bozulmalara neden olabiliyor dediğiniz gibi
Sunucuya yük bindirmez, alt tarafı css