Facebook Thumbnail (Öne Çıkarılmış Görsel) Sorunu

22 02 2013 11:41 tarihinde, WordPress kategorisinde yazıldı. 10 yorum yapıldı, 8849 kez okundu

logo-wordprss-thumbnailBir yazar için okuyucu kitlesinin büyüklüğü önemlidir. Yazıların okunma sayısını da en çok sosyal medya paylaşımları ve e-posta bültenleri etkiler.

Yazdığınız içerikleri paylaşmak ve doğru hedef kitleye ulaşmak için azami özen göstermek zorundasınız. Bir yazınızı paylaşırken özet kısmı ve başlığın yanı sıra Facebook ve Twitter (Twitter Kart ile) gibi sitelerde bir de yazıyı destekleyen fotoğraf yer alır. Thumbnail yani öne çıkarılmış görsel olarak ifade edilen bu fotoğrafın yazı ile alakalı olup olmaması bağlantınızın tıklama oranını etkiler.

Cep telefonları ile ilgili yazdığınız bir yazıyı paylaştığınızda öne çıkarılmış görselin bir manzara fotoğrafı olması itici bir unsurdur. Bu durumda, kullanmış olduğunuz site şablonunuzun bir şeyleri eksik demektir. Thumbnail olarak seçilen bir fotoğrafı paylaşım sırasında seçme lüksümüzün olmayışı doğru tema seçimi ya da doğru tema ayarlarını mecbur kılar.

Facebook gibi sitelerde paylaşım yaparken doğru fotoğrafın çıkması için temanızda kullanmanız gereken birkaç kod vardır. Şimdi sizlere bu kodlardan bahsedeyim.

Öne çıkarılmış görseller sadece yazı ve sayfalarda yer alır. Anasayfa için öne çıkarılmış bir görsel olmayacağı için bir şart belirtmemiz gerekir. Yani eğer yazılarda ve sayfalarda isek bize öne çıkarılmış görseli göster dememiz gerekir.

Eğer anasayfa gibi diğer kategori ve arşivlerin bağlantısı paylaşıldığında Facebook’ta ya da diğer sitelerde bir fotoğraf gözükmesini istiyorsak onun için de şartı sağlamadığı taktirde bir fotoğraf gösterilmesini sağlayacağız.

Yani yazı ve sayfadaysak bize o sayfa ya da yazının öne çıkarılmış görselini göster, değilsek bir fotoğraf seçelim onu göster. ya da kafana göre takıl diyebiliriz.

Kullanacağımız kod kalıbı şöyledir:

<?php
if ( is_singular() )
{ ?>
Sayfadayız ya da yazıdayız bize öne çıkarılmış görseli ver
<?php }
 else
{ ?>
sayfada ya da yazıda değiliz bize şu fotoğrafı göster
<?php }
?>

Kalıbımızın başında belirttiğimiz is_singular ifadesi sayfada ve yazıda olup olmadığımızı bildirir.

Her iki koşulda da fotoğrafı çağırmak için “link rel” ifadesini kullanacağız. Yani bağlantı olduğunu belirten ancak tarayıcımızda somut olarak gözükmeyen bağlantı tanımlayacağız.

Bu kodun kalıbı da şöyle olacaktır:

<link rel="image_src" href="çağırılacak fotoğrafımızın adresi" />

Kalıbımızda çağırılacak fotoğraf adrsi olarak thumbnail kullanacağız.
Eğer “timthumb.php” dosyası ile fotoğraflarınızı kırparak gösteriyorsanız çağrılacak görsel adresine onu girmelisiniz.

Varsayılan thumbnail kodu şu şekildedir.

<?php the_post_thumbnail(''); ?>

Kalıpları yerlerine yazacak olursak kodun son hali şöyle olacaktır:

<?php
if ( is_singular() )
{ ?>
<link rel="image_src" href="<?php the_post_thumbnail(''); ?>" />
<?php }
 else
{ ?>
<link rel="image_src" href="http://www.nebigarci.net/wp-content/themes/nega/images/logonega.png" />
<?php }
?>

Sayfada ve yazıdaysak öne çıkarılmış görselimiz gelecek. Değilsek yukarıda ben kendi logomu tanımladım o gelecek. Kodları temada header.php dosyasındaki <head></head> etiketleri arasına eklemelisiniz.

Tema değişikliklerinde yaşanan en büyük sorunlardan birini çözmüş olduk. Sabırla okuduğunuz için teşekkür ederim 🙂

Bu konudaki düşüncelerinizi siz de yorum olarak paylaşabilir, aşağıdaki butonlar aracılığıyla daha çok kişiye ulaştırabilirsiniz.

Bunlar da İlginizi Çekebilir
Bu Makale 10 Yorum Aldı. Siz Ne Düşünüyorsunuz?
  1. 10 numara yazı olmuş.Anlatım için teşekkürler çok işime yaradı.

  2. Hocam dediklerinizi uyguladım ancak gene de istediğim sonucu alamıyorum. Kodları doğru yere ekledim ancak hala yazıdaki öne çıkarılmış görseli paylaşmıyor. G+ ta paylaşırken sorun olmuyor da facebookta sorun.

    • Bazen temadan kaynaklı olarak sorun olabiliyor. Benzer bir yöntem daha var ancak o konuda tam bilgim yok. open graphe yazarsan Gooogle’da daha fazla kaynak bulabilirsin.
      Kodun kalıbı şöyle:

      <meta property="og:image" content="görsel url/>
  3. WordPress olmayan sitede ne işlem yapacağım bune herkes wordpressci olmuş webciyim diye geçiniyorlar ya

    • Tamam sen daha iyisin, sen de wordpress olmayan site için yazarsın.

      • Tabiki kendi panelim var php tabanlı müşteri odaklı özel tasarım yapıyorum template kullanmıyorum. bu arada kendimi beğenme gibi bir durumum yok lafım sana değil wordpress kullanıp ben webmasterım vs diyenlere

  4. ya sen varya sen adamın hammaddesisin son noktasısın seviyorum seni 🙂

  5. Kolay gelsin wordpress makalesini facebookta paylaşınca resim alanı komple beyaz çıkıyor. Facebook og:image etiketini resim urlsli değilde direk site url si olarak çekiyor. Kaç gündür uğraşıyorum hala bulamadım. Bir bilginiz var mı?

    • Kullandığınız seo eklentilerinde bu özellikle bir sıkıntı olabilir. Bunun haricinde header.php dosyasındaki og:image etiketine görsel edersi olarak yanlış fonksiyon girilmiş olabilir. header.php’de yoksa function.php’de ya da single.php’dir büyük ihtimal. O kodlara ulaşmanız gerek. Görsel adresini alamıyordur.

  6. Header ve functions ve tüm tema dosyalarını araştırdım böyle bir sonuç yok. og:image etiketi yok yani. Kullandığım seo da All İn Seo ne gibi bi sıkıntı olabilir.

Sponsorlu Bağlantılar

Son Yorumlar

  • Samet Misafir

    Kardeşim ben hesap doğrulaması yaparken @gmail yerine @gmal yazmışım ve hesap kitlendi bundan ötürü bi bilgin var mı nasıl alabilirim hesabı
  • Samet Misafir

    evet
  • Samet Nebi Garcı

    Mesajı 20 dakikada bir atmak üzere zamanlamaktan mı bahsediyorsunuz?
  • Samet Misafir

    merhabalar kod için teşekkür ederim. birşey merak ediyorum. 20 dakikada bir olarak programlama şansımız var mıdır acaba?
  • Samet selçuk ünal

    twitter hesabım kilitlendi sadece e-posta onaylayıp sıfırlama yapmam gerekiyor fakat e posta adresimi hatırlamıyorum nasıl giriş yapabilirim