Open Graph Kullanımı | Serkan Dinç
Sosyal Medya Sunumu
17 Kasım 2014
Sosyal Medya Optimizasyonu
Sosyal Medya Optimizasyonu
2 Aralık 2014
Tümünü Göster
Facebook Open Graph Kullanımı

Facebook Open Graph Kullanımı

Bismillahirrahmanirrahim… Selamun Aleykum,

OG yada tam anlamıyla Open Graph Facebook ile birlikte meşhur olmuş, SEO ve Sosyal Medya Uzmanları tarafından oldukça kullanışlı bir araç haline gelmiştir. Facebook ile meşhur olan araç daha sonra çeşitli mecralarda kullanım amacına göre farklılıklar yaşadı. Bu yazıda biraz Open Graph Nedir? Sorusuna cevap vereceğiz birazda Facebook Open Graph  kullanımı hakkında bilgivereceğim.

İlk olarak Open Graph’ın ne olduğunu biraz açıklayalım ardından Facebook’ta nasıl kullanılır bunu anlatalım. Eğer bilgi almak yerine direk aksiyona geçmek istiyorsanız bu bölümü atlayıp aşağıdan Open Graph Kullanımı’na geçebilirsiniz.



Open Graph Nedir?

Open graph kavramı Sosyal Medya gibi Web 2.0 teknolojisiyle birlikte hayatımıza girmiş ve Sosyal Ağların en son güncellemeleriyle birlikte oldukça yaygınlaşmıştır. Özellikle Facebook’un bu konuda atmış olduğu adımlar SEO ve Sosyal Medya Uzmanları için büyük önem arz ediyor. Facebook’un atmış olduğu adımlardan sonra diğer Sosyal Ağlar ve arama motorlarıda bu kavramı benimseyerek bu konuda uygulamalar geliştirdi.

Facebook Opengraph Kullanımı

Facebook Opengraph Kullanımı

Open Graph kavramını en basite indirgeyerek açıklanması gerekirse; İnternette dolaşan kişilerin hangi videoyu izlediğini yada başka neler yaptığıın kaydını tutmak, daha etkin ve daha geniş kitlelere reklam yapılmasını sağlayan bir teknolojidir. Bu sayede internetteki reklam alanları çok daha geniş düzeylere ve  direk olarak hedef kitlelere ulaşacaktır. Bunun yanında og teknolojisi altyapısını kullanan bir sitede izlediğiniz videoyu sizin haberiniz olmadan facebook zaman tünelinizde şu kişi bu videoyu izledi diyerek bir gönderi yayınlanacaktır ki buda bir reklam çeşididir. Türkçe açılımı Açık Grafik protokolü olarak geçmektedir. Open Graph tekniği  yardımıyla sitelerinize bir çok ziyaretçi çekebilirsiniz. Örneğin gene videolardan örnek verecek olursak; sitenizde video izleyen  kişinin facebookta zaman tünelinde  izlediği video otomatik olarak paylaşılacaktır. Böylece arkadaşının izlediği videoyu gören kişilerde bu uygulamayı kullanacak,onlarında arkadaşları videoyu izlemek isteyeceklerdir. Tamamı size oldukça geniş bir hit getirisi temin edecektir. Sadece video olarak değil kullanıcıların bütün aksiyonlarına open graph destek vermektedir. Bu konu daha fazla uzatılabilir. Ancak bu kadar bilgi yeter diye düşünüyorum. Dilerseniz daha farklı kaynaklardanda bilgi edinebilirsiniz.

Open Graph ve Open Graph Kullanımı hakkında detaylı Bilgi

Facebook Open Graph Kullanımı

Facebook’ta Open Graph kullanmak için ilk önce bir Facebook APP ID’si almamız gerekiyor. Bunun için aşağıda ki adımları takip edebilirsiniz.

1. Adım: Facebook Developers adresine giderek Apps sekmesine tıklıyoruz ve Create New App diyoruz.

Burada ki bilgileri doldurup kategorinizi seçin ve Create App butonuna tıklayın. Name Space alanına kullanacağınız internet siteniz ile ilgili herhangi bir şey yazabilirsiniz. İsterseniz boşta bırakabilirisiniz.

Facebook Opengraph Kullanımı

Facebook Opengraph Kullanımı

2. Adım: Karşınıza çıkan sayfanın sol tarafa bulunan Settings sekmesine tıklayın ve aşağıdaki sayfaya gelin. Bu sayfada App Domains alanına aşağıda ki resimde de olduğu gibi internet sitenizin adresinizi yazın ardından Contact Email alanına E-Posta adresinizi girin ve enter yapın. En üstte bulunan App ID‘nizi bir yere not almayı unutmayın.

Facebook Opengraph Kullanımı

Facebook Opengraph Kullanımı

3. Adım: Girdiğiniz bilgileri kaydettikten sonra aşağıda bulunan + Add Platform butonuna tıklayın. Burada karşınıza 8 seçenek çıkacak bu seçenekler arasından Website’yi seçin ve aşağıdaki gibi açılan sekme içerisinde Site URL kısmına internet sitenizin adresini benim yazdığım gibi yazın kaydedin.

Not: Yalnız benim yazdığım internet sitesinde SSL protokolü uygulandığı için ben HTTPS olarak yazıdım. Eğer sizin internet sitenizde SSL sertifikası yoksa sadece HTTP olarak yazın.

4. Adım: Bu adımdan sonra artık Facebook ile işimiz bitti. bundan sonra yapacağımız işlemler internet sitemiz üzerinden olacak. Şimdi ki aşağıda bulunan kodları bir metin editörüne kopyalayalım çünkü bir kaç değişiklik yapacağız.

– Facebook App oluştururken size verilen APP ID’yi ilk satırda ve en altta script tagleri arasında bulunan ID ile değiştirin.

Fınd My Facebook ID sayfasına giderek kullanıcı adınızı yazın ve verilen ID’yi 2. satırda bulunan ID ile değiştirin.

14. satırda bulunan Description alanına sitenizi tanıtan kısa yazıyı ekleyin.

16. satırda bulunan Image alanına paylaşımda görünmesini istediğiniz görselin adresini ekleyin.

Aşağıda ki kodlar WordPress CMS sisteminin header.php dosyasına uygundur. Sizde bu kodlardan yardım alarak internet sitenize göre yada CMS sisteminize göre uygun hale getirebilirsiniz.
<meta property=“fb:admins” content=“743809690” />
<?php if (is_single()) { ?>
<meta property=“og:url” content=<?php the_permalink() ?>/>
<meta property=“og:title” content=<?php single_post_title(); ?> />
<meta property=“og:description” content=<?php echo strip_tags(get_the_excerpt($post->ID)); ?> />
<meta property=“og:type” content=“article” />
<meta property=“og:image” content=<?php if (function_exists(‘wp_get_attachment_thumb_url’)) {echo wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); }?> />
 
 
<?php } else { ?>
<meta property=“og:site_name” content=<?php bloginfo(‘name’); ?> />
<meta property=“og:description” content=“sosyal medya, wordpress, tasarım, web konularında paylaşımlar yapılan ve aynı sektörde bulunan kişilerin de yazılarının paylaşıldığı kişisel blog.” />
<meta property=“og:type” content=“website” />
<meta property=“og:image” content=“http://www.gokhanmms.com/wp-content/uploads/2014/01/gokhanmms-fb-small.png” /> <?php } ?>
 
<script>
  window.fbAsyncInit = function() {
        FB.init({appId: ‘291797800967969’, status: true, cookie: true,
                         xfbml: true});
  };
  (function() {
        var e = document.createElement(‘script’); e.async = true;
        e.src = document.location.protocol +
          ‘//connect.facebook.net/en_US/all.js’;
        document.getElementById(‘fb-root’).appendChild(e);
  }());
</script>
Serkan Dinç
Serkan Dinç
Sosyal Medya, Kurumsal - Kişisel Web Sitesi ve E-Ticaret sitelerinde çözümler üretiyorum. Şuanda Pio Ajans, Sosyalimci gibi dijital hizmetler veren kurumlara destek veriyor ve freelance çalışmalarıma devam ediyorum.

2 Comments

  1. Fevzi Çakır dedi ki:

    All in one seo içerisinde bulunan sosyal bölümü nasıl kullanabiliriz?

    • Serkan Dinç dedi ki:

      Yorum bölümünden detaylı olarak anlatmak zor. Fakat eklenti içerisinde “?” işareti ile gösterilen yerlere tıkladığınızda nasıl kullanacağınız hakkında size detaylar sunacaktır. Yakın zamanda bu konuyuda detaylı bir şekilde anlatmaya çalışacağım.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir