Wordpress Türkiye

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 &raquo;'); ?>

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.

WordPress Default Tema Index Dosyası

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 &amp;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…