WordPress 2.9 Sürümüyle hayatımıza giren bu özellik, web sitelerimize görsel anlamda yeniden boyut kazandırabiliyor aynı zamanda tanımlanabilir css özelliği olması neticesiyle birbirinden güzel resimler ortaya görseller ortaya çıkarmakta bizim elimizde, hemen altta küçük bir anasayfa,kategori,etiket sayfasında görünen öne çıkarılmış görsel örneği verdim. ben etrafını oval köşelerle kaplayarak kodların içerisine class atadım bu sebeple benimki bu şekilde görünmekte. Siz isterseniz hover isterseniz çok farklı css kodları kullanarak sınırsızca geliştirme sağlayabilirsiniz. Aynı zamanda yazı içerisinde ki resimlerin seo açısından önemi oldukça fazladır bu görsellerle beraber yazının alt tagını ve titlesini belirleyip yazıya özel isimler atayıp google ile ilişkilerinizi daha da güçlendirebilirsiniz.

Örnek Resim

wordpress-one-cikarilmis-gorsel

Bu işlemi 2.9’dan önce özel alan yardımıyla’da yapabiliyorduk ama WordPress sürekli gelişmekte olan bir sistem olduğu için her gün yeni özellikler eklenebiliyor, oldukça da işe yarıyor doğrusu. Aynı zamanda açık kaynaklı kodlama yapısına sahip olan wordpress sistemi paket haline getirdikten sonra bizler için geliştirmeye açabiliyor, birazdan anlatacağım üzere hem özel alandan hemde öne çıkarılmış görselden hangisini kullanmışsak onu gösterebilme imkanına kadar değişim yapabiliriz.

Yapılabilecek İşlemler

  • Öne çıkarılmış özelliği kullanabilme
  • Yazıya ait ilk resmi öne çıkarılmış özellik olarak atama
  • Öne çıkarılmış görsel veya özel alan resmini İf Else ile seçtirme
  • Timthumb ile boyutlandırıp özel alan veya öne çıkarılmış görsel kullanabilme Bknz ( WordPress Öne Çıkarılmış Görsel ve Timthumb )

İşlemleri sırasıyla ve adım adım anlatmaya çalışacağım, Ayrıca değişik tarzda kodlamalar yapıp denemesini yaptıktan sonra konuyu elimden geldiğince güncellemeye çalışacağım.  Şimdiden başarılar.

1-Adım

functions.php dosyanızı açıp <?php kodlar ?> şeklinde aşağıda ki kodları ekleyiniz.

add_theme_support( ‘post-thumbnails’ );

Bu işlemi yaptıktan sonra yazı ekleme paneline resimde ki gibi bir alan eklenir. Bu eklediğimiz kod aracılığıyla hem konulara hemde sayfalara öne çıkarılmış görsel desteği eklemiş olduk.

wordpress-one-cikarilmis-gorsel-resmi

 

2.Adım

Yalnızca konuları veya yalnızca sayfaları hedef alarak öne çıkarılmış görsel ekleyebilirsiniz.

Aynı şekilde functions.php içerisine <?php kodlar ?> şeklinde aşağıda ki kodları ekleyebilirsiniz.

//Sadece yazılara öne çıkarılmış görsel özelliği eklemek
add_theme_support( 'post-thumbnails', array( 'post' ) );
//Sadece sayfalara öne çıkarılmış görsel özelliği ekleme
add_theme_support( 'post-thumbnails', array( 'page' ) );

3.Adım ( Eklenen Resimleri Boyutlandırma)

Aşağıda ki verilecek kodlarla beraber yazı ve sayfa alanları için özel boyutlandırma yapabilirsiniz, bulunduğu konuma göre değişiklik gösterecektir. Yukarıda maddeler halinde verdiğim özellik alanında son Madde’de WordPress Öne Çıkarılmış Görsel ve Timthumb konusun da,  daha farklı metotlarla boyutlandırma yapabilirsiniz ayrıca bu özellikle beraber resimleriniz cachelenir ve kullanıcılar her girdiğinde yeniden yeniden resimleri yüklemek zorunda kalmaz, bu hem sunucunuz açısından tasarruf sağlar, hem de kullanıcıların sitenizde geçirdiği süreyi artırıp site hızına gözle görülür (%25) derecede güzellik sağlar.

functions.php dosyasına eklemeniz gereken kodlar ( <?php kodlar ?> şeklinde )

// Yazı öne çıkarılmış görsel ekleme kodu
add_theme_support( 'post-thumbnails');
// Resmi 120x120 boyutlandırında küçültüp kırpar koddaki true kırpma işlemini görür.
set_post_thumbnail_size( 120, 120, true );

 

// Yazı öne çıkarılmış görsel ekleme kodu
add_theme_support( 'post-thumbnails');
// Resmi 120x120 boyutlarında  bu oranı aşmayacak şekilde küçültür
set_post_thumbnail_size( 120, 120 );

 

4.Aşama (Konu içerisinde Kullanımı)

<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail();
} else {
<img src="resim.jpg" alt="resim-yok" />
<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail();
} else {
<img src="resim.jpg" alt="resim-yok" />
}
?>

Bu kodu index.php,single.php,category,archive.php gibi alanlarda döngünün arasında kullanabilirsiniz.

İşlemimiz bu kadar.

Öne Çıkarılmış Görsel ve Özel Alanı Beraber Kullanma konusunda öne çıkarılmış görsel ile özel alanda ki resim kodunuzu aynı anda kullanımından bahsettim.

Kolaylıklar Dilerim.

Metin Saraç 2 299 28 Nisan 2014
0 beğeni - 2 Yorum