WordPress Yazılara Thumbnail Resim Alanı Eklemek 25

Merhaba arkadaşlar bir arkadaşın ricası üzerine wordpress temalarımıza thumbnail alan eklemesini ve kullanılmasını göstereceğim. Bu sayede yazılarınızın içinde resimde göstererek görsel olarak daha güzel görünmesini sağlayacaksınız. Örnek olarak ben kendi sitemde thumbnail alan ekleyerek resimleri gösteriyorum.  Bu yazımızı tamamladıktan sonra sizlerde kendi web sitelerinizi aşağıdaki gibi görünüme kavuşturabilirsiniz.

[ad#orta]

Wordpress Thumb Resim
İlk olarak temanızın bulunduğu klasör içine girip, oradan functions.php ‘yi açmanız gerekecektir. Daha sonra aşağıdaki satırı bu dosyaya isterseniz sorun çıkmaması açısından en başa eklemeniz yeterli olacaktır.

<?php add_theme_support( 'post-thumbnails' ); ?>

Bu şekilde bir kullanım en basitidir. Bunu yazılarda kullanmak için ise şunu yapmalıyız. Diyelim bir yazı yazıyoruz ve bir resim ekleyerek onu thumbnail resim yapmak istedik. Admin panelimizde yazı ekleme kısımında hemen Yazı etiketlerin altında Öne çıkan görsel olarak aşağıdaki gibi bir pencere gelmiş olması gereklidir. Eğer siz de de o pencere geldiyse thumbnail alan aktif edilmiş demektir.
Thumbnail Akitf
Yukarıdaki işlemleri başarıyla gerçekleştirdiyseniz şimdi sırada resimlerin boyutunu ayarlama işlemleri var.
Resim boyutunu ayarlamak için functions.php deki kodu aşağıdaki gibi değiştirelim.

<?php
add_theme_support( 'post-thumbnails'); //Yazılarıma resim desteği 
 
set_post_thumbnail_size( 623, 162, true );// Resmi 623px genişlikte ve 162px yükseklikte ayarlar(Siz bu boyutu kendinize göre değiştirebilirsiniz.)
 
add_image_size( 'single-post-thumbnail', 623, 400 );//Tekil yazıdaki gözükecek boyut(Siz bu boyutu kendinize göre değiştirebilirsiniz.)
 
?>

Evet arkadaşlar şu anda functions.php ‘deki işlemlerimiz bitti. Geldi sıra bunu anasayfada (index.php) gösterme komutlarını yazmaya. index.php dosyamızı açalım ve aşağıdaki kodu the_content() fonksiyonun üzerine yerleştirelim.

<?php
         if ( has_post_thumbnail() ) {
             //Thumbnail resim varsa resmi gösterir.
            the_post_thumbnail();
          } else {
 ?>
 
            <img src="resimyok.jpg" alt="resimyok" />
 <?php // Thumbnail resim yoksa resimyok resmini gösterir.
         }
      ?>
 
      <?php the_content('Devamini oku...');//Bu satırın üzerindeki kodlar bizim kodlarımızdır. Siz de yukarıdaki kodları bu satırın üzerine yerleştiriniz. 
?>

Evet şu ana kadar her şey normal bir düzeyde ilerlerdi. Yukarıdaki kodu resimi görmek istediğiniz sayfalara (örneğin: archive.php,single.php …) yerleştirerek thumbnail resimleri gösterebilirsiniz.
Bir de thumbnail resmi nasıl ekleriz onu gösterelim ve yazıyı sonlandıralım. Admin panelimizden yazı ekle dedikten sonra aşağıdaki resimde görüldüğü gibi Öne çıkarılmış görseli belirle bağlantısını tıklayalım.
Thumbnail Akitf
Karşımıza aşağıdaki gibi bir pencere gelecek normal resim yükleme penceresi oradan resminizi seçin ve Öne çıkarılmış görsel olarak kullan bağlantısını tıklayın.

Artık yazınıza bir thumbnail resim eklenmiş olacaktır. Sizlerde yazılarınızı bu şekilde görsel bir şölene dönüştürebilirsiniz. Umarım faydalı olmuştur. Ha bu arada sizce wordpresste thumbnail alan mı kullanılmalı yoksa özel alanlarla idare mi edelim.

25 thoughts on “WordPress Yazılara Thumbnail Resim Alanı Eklemek

  1. Reply Mert Eyl 2,2011 13:33

    Çok güzel bir yazı olmuş teşekkürler.

  2. Reply adminyxlylmz01 Eyl 20,2011 12:46

    teşekkürler güzel anlatım 🙂

  3. Reply halil Ara 11,2011 19:09

    Anlatım için teşekkürler fakat bir sorum olacak anasayfada gözüktü sorunsuz birşekilde fakat katagorilerde görünmesi için hangi dosyaya koymam gerekiyor archive.php ye ekledim fakat resimler gelmedi acil yanıtlarsanız sevinirim..

  4. Reply halil Ara 12,2011 20:24

    @hsnhsynisler
    cevap için teşekkürler fakat temanın içinde category.php de yok
    single,page,archive.php hepsine denedim fakat hiçbirinde gözükmüyor sadece index.php de yani anasayfada işe yarıyor:S

    • Reply hsnhsynisler Ara 13,2011 14:19

      O zaman sayfalarda eklediğiniz yerleri kontrol edin hocam. Ve tabi kodlarınızı da.

  5. Reply Nurettin Ara 13,2011 18:57

    be 150×150 boyutunda yaptım ekledim fakat yazılar altında geliyo resmin. ben resmin yanında da yazılar olsun istiyorum.

    • Reply hsnhsynisler Ara 13,2011 20:28

      Resmin özelliğini css den float:left; gibi değerler vereceksin. Orasını css ile yapacaksınız.

  6. Reply Cüneyt Ara 26,2011 14:03

    add_image_size( 'single-post-thumbnail', 623, 400 );

    bu kod singlede boyutlandırmak için ben ayrıyetten category.php yapdım ve ordada ayrı boyutlandırsın dıye su kodu denedım

    add_image_size( 'category-post-thumbnail', 623, 400 );

    ama olmadı category için farklı boyutlandırma yapmak istiyorum orda ne kullanmalıyım?

  7. Reply Cüneyt Ara 27,2011 11:05

    Yok ya beceremedim kardeş sen şu functions.php benim için yeniden düzenlermisin acama isdediğim şey şu öne çıkan resim belirlediğimde ana sayfada 1280×720 olsun category ve single de ise 250×250 olsun fazla zamanını almaz dıye dusunuyorum yardım edersen cok sevırınırım verdıgın kaynaklara bakdım ama olmadı :S

    • Reply hsnhsynisler Ara 27,2011 12:45

      Hocam o kaynaklara bak işte ben bu aralar hiç nette bu işlerle ugraşma fırsatım olmuyor. Sadece maillere bakıp çıkıyorum.

  8. Reply Cüneyt Ara 27,2011 11:59

    Sorunu çözdüm category.php de kullanmam gereken kod şuymyş

    <?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'category-thumb' ); } ?>

    herkese teşekkürler iyi çalışmalar umarım bu cevap da sorun yaşayanlara yardımcı olur.

  9. Reply Barış Kalfa Tem 16,2012 15:06

    Merhaba ben dediklerinizi düzgünce yaptım ve oldu thumbnasil temamda gözüküyor ama thumbnail içeriğin üstünde gözüküyor ve içerik ise altta kalmış ben php de çok iyi değilim div align falan denedim bişi olmadı 😀 lütfen bana yardımcı olun çoğu blog sitesindeki gibi kare thumb köşede durmasını ve yazınında diğer boş kalan yeri doldurmasını istiyorum anlamadıysanız siteme bakın 🙂 bariskalfa.com

    • Reply hsnhsynisler Tem 16,2012 19:29

      Eklediğin resimin html koduna style="float:left;padding:10px;" kodunu eklerse sorun düzelecektir.

      • Reply Barış Kalfa Tem 17,2012 14:47

        Çok sağolun şimdi oldu css geliştirmem gerekiyor sanırım 😀

      • Reply Barış Kalfa Tem 17,2012 14:53

        Çok özür dilerim oldu diye yazdım acele ettim aslında ben thumb çıkması için index.php dosyasındaki the_content in üstüne bunu yazdım:
        <?php

        if ( has_post_thumbnail() ) {
        //Thumbnail resim varsa resmi gösterir.
        the_post_thumbnail();
        } else {
        ?>
        <img src="resimyok.jpg" alt="resimyok" />
        <?php // Thumbnail resim yoksa resimyok resmini gösterir.
        }
        ?>
        Burada html olarak style ekleyebileceğim bir yer yok sanırım. Varsa da nereye yazacağımı söylermisiniz?

        • Reply hsnhsynisler Tem 18,2012 13:08

          the_post_thumbnail(); yazan yeri bir div içine al ona style ekle bir çok yol var bunun için.

  10. Reply Sohbet Ağu 3,2012 10:59

    Tşk ederim baya bi işime yarıcak kodu buldum sanırım 😛

  11. Reply ZUNELABS Tem 11,2013 01:39

    Böyle bir şey benim sitemde de var ama sorun şu ki ben resim yok görseli/yazısı yerine resmi olan bir önceki başka bir gönderinin gösterilmesini istiyorum. Böyle bir şey mümkün mü?

  12. Reply Samsun cilingir Haz 16,2017 17:21

    merhaba yaziniz cok guzel bana cok yarari dokundu ama bir sorunum daha gorsellerden cikin bir sikintim bilen varsa yazsın lutfen one cıkan gorselleri tiklayarak resmı yukluyorum yukluyor ama tıkladıgım zaman sayfaya koymuyor neden boyle bir sıkıntı oluyor cözemedim

Leave a Reply