WordPress görselleri otomatik ölçeklendirme

WordPress görselleri otomatik ölçeklendirme

WordPress tema yapmaya başladığımdan beri karşılaştığım ufak tefek sorunlar var ve bunları not alıp çözümlerini sizlerle paylaşmak istiyorum. WordPress veya herhangi bir içerik paylaşılacak yazılım yaparken yüklenen görsellerin içerikten taşması belki bir çoğunuzun başına gelmiştir. Bu yazımda çok ufak dokunuşlarla bu sorunu nasıl ortadan kaldırırız bunu göreceğiz.

Öncelikle wordpress’te bunu otomatik olarak ortadan kaldıran eklentiler mevcut. Örneğin;

nCode Image Resizer eklentisi.

wordpress otomatik resim boyutlandırma
wordpress otomatik resim boyutlandırma

nCode Image Resizer eklentisini kurduğunuz zaman WordPress içeriklerinizde bulunan ve belirlediğiniz boyuttan büyük görseller küçültülerek yukarıdaki görseldeki hale geliyor.

Fakat her zaman dediğim gibi WordPress’te bir sorun eklentisiz çözülebiliyorsa, o yolu kullanın :) Çünkü eklentiler her zaman fazladan kod, fazladan sorgu, fazladan hız kaybı demektir.

WordPress İçeriklerinizdeki Görselleri Ölçeklendirme

WordPress tema klasörünüzdeki “single.php” dosyanızı açın ve içeriklerinizin görüntülendiğin divleri (kısımları) bulun.

wordpress otomatik resim boyutlandırma 1

Kodunu çevreleyen divlerimizi bulduktan sonra aşağıdaki css kodlarını bu divlere atayalım.

Yukarıdaki kodları css dosyamıza ekledikten sonra kaydettikten sonra görselleriniz içerik divlerinizden daha geniş olma durumunda genişliğini otomatik olarak %100 ayarlayacak ve divinizin boyutuna gelecektir.

Not: Fakat unutmayın. Bu ölçeklendirme sadece genişlik içindir. Görselin boyutunda hiç bir değişiklik olmaz. Çok büyük görsel yüklemeden önce düzenlemeyi unutmayın.

Bir Cevap Yazın