the_post_thumbnail ile Öne Çıkarılmış Görselleri Çekelim

the_post_thumbnail, WordPress konularımızda eklediğimiz öne çıkarılmış görselleri direkt olarak çekmemize yarayan bir fonksiyondur.

Özellikle tema yapımı ve düzenlenmesiyle ilgileniyorsanız özel listelemeler için bu etiketi kullanmanız kaçınılmaz.

Sizlere bu fonksiyonun array desteğinden bahsedeceğiz. Böylece paylaşacağımız değerleri kullanarak çektiğiniz görseli boyutlandırabilir, sağa-sola yaslayabilir, alt  title değerini değiştirebilirsiniz.

the_post_thumbnail

Kullanım tipi gayet basit. WordPress ile listeleme yaptığınız döngünün içerisine yerleştirmeniz halinde otomatik olarak ilgili thumbnaili yayınlayacaktır.  Kullanımında <image> etiketi otomatik olarak geldiği için olduğu gibi kullanılmalıdır. Örneklendirme ile devam edelim. Bir konunun thumbnail öğesi varsa onu gösterelim :

<?php
if(has_post_thumbnail()) { // konuda thumbnail kullanılmış mı diye kontrol et
the_post_thumbnail();
}
?>

Boyutlandırma

Yayınlayacağınız thumbnail (öne çıkarılmış görsel) için boyut belirtiyoruz. Aşağıda kullanabileceğiniz değerler mevcut.

the_post_thumbnail();  // Parametresiz. Varsayılan kullanım tipi
the_post_thumbnail('thumbnail'); //(varsayılan 150x150)
the_post_thumbnail('medium'); // (varsayılan 300x300)
the_post_thumbnail('large'); // (varsayılan 640x640)
the_post_thumbnail('full'); // (upload edildiği gibi - en büyük)
the_post_thumbnail(array(100,100) );  // Boyutlandırmayı kendiniz seçin
  1. class : alignleft aligncenter alignright olarak değiştirilebilir.
  2. alt : Herhangi bir açıklama metni girilebilir. <?php the_title(); ?> kullanılarak konu başlığı ayarlanabilir.
  3. title : Herhangi bir açıklama metni girilebilir. <?php the_title(); ?> kullanılarak konu başlığı ayarlanabilir.

Linklendirme

Thumbnail öğelerine link vermek için href kodu girmeniz gerekmektedir. Örnek kullanım şekli aşağıdaki gibidir.

<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" >
   <?php the_post_thumbnail(); ?>
   </a>

Bu değerlere göre örnek kodumuzu yazalım :

<?php the_post_thumbnail('full', array('class' => 'alignleft','alt' => the_title(),'title' => the_title())); ?>

Üstteki kodu kullandığınızda, en büyük boyutlarda, sola yaslanmış, üzerine gelindiğinde bağlı olduğu başlığı gösteren bir öne çıkarılmış görsel yayınlarsınız.

Kapanış

Bu etiket özellikle tema düzenleyicileri için önem arz etmektedir.the_post_thumbnail() fonksiyonu wp-includes/post-thumbnail-template.php içersinde tanımlanmıştır.



  • Gökhan

    Rss le siteme yazı çekiyorum ve bu yazıların içerisinde imaj linkleri bulunuyor. bu imaj linklerini kullanarak otomatik öne çıkarılmış görsel yapmam mümkün müdür? teşekkürler

  • Bilgilopedi.Org

    teşekkürler çok yararlı oldu…

  • Buğra Okyay

    Hocam kendi boyutlarımızı girdiğimiz kodu kullanıyorum ama girilen genişlik değerine göre yükseklik otomatik oranlanıyor. Ben orantısız dahi olsa benim girdiğim boyutlarda olsun istiyorum ama bir türlü olmuyor.. Mesela the_post_thumbnail(array(190,90) ); şeklinde kullanıyorum. Genişlik 190 px oluyor ama yükseklik 90px olmuyor orjinal boyutlara göre orantılı şekilde küçülüyor.

  • Ersin

    Merhaba,
    Linklendirme kısmında yapmak istediğim, görsele tıklandığında ortam sayfası içinde görselin orjinal boyutunu görüntületmek. Nasıl yapabilirim ?