Sosyal Medya Paylaşımı | Facebook (Open-Graph) & Twitter Share

Merhabalar,

Facebook ve Twitter sharelarinizi renklendirmenin zamanı geldi.

Facebook, Open Graph ile Twitter ise kendi geliştirdiği meta taglarıyla daha düzgün paylaşım yapmanızı saglayacak düzenlemeler getirdi. Bu tagları kullanarak sizde paylaşım yapıldığında daha modern gözükebilirsiniz.

Facebook için sitenizi şu linkten kontrol edebilirsiniz.

Twitter için de sitenizi bu linke girdikten sonra 2. tab olan Validate&Apply a geçip siteyi kontrol edebilirsiniz.

Gelelim şimdi konumuza paylaşımlarınız sitedeki random bir resimi seçip güzel gözükmesi gerekirken kötü gözükmesi hepimizin başına gelmiştir. Bugün bunun önüne geçiyoruz.

Adım 1. Üstteki linkleri kullanarak sitemizi bir validasyona sokalım. (Twitter için bunu yaparken kendimize yeni taglar oluşturabiliyoruz.)
Adım 2. Sitemizin head tagları içerisine meta taglarini eklemeliyiz.
Adım 3 :

Facebook için genel olanlar;

<meta property="og:type" content="article" /> <-- Blog yazarı iseniz bloglarınızı bu type ile paylaşırsanız faydalı ve doğru bir kullanım olacaktır. Eğer sitenizi ya da başka birşeyi paylaşmak istiyorsanız diğer tüm typeları facebook opengraph apisine bakarak karar verebilirsiniz.
<meta property="og:title" content="" /> <-- Buraya sayfanın title bilgisi gelmeli (Otomatiğe bağlama imkanınız var ise hiç düşünmeden bağlayın.
<meta property="og:image" content="" /> <-- Burası paylaştığınızda haber satırının yanında göstereceği resimdir. Otomatiğe bağlayıp paylaştığınız yazının bannerını almasını sağlayabilirsiniz. Ya da tek bir resim seçerek logonuz olabilir mesela onu gösterebilirsiniz.
<meta property="og:description" content="" /> <-- Buraya sayfanın title bilgisi gelmeli (Otomatiğe bağlama imkanınız var ise hiç düşünmeden bağlayın.

 

Twitter için genel olanlar;

<meta name="twitter:card" content="summary"> <– Blog yazarı iseniz bloglarınızı bu type ile paylaşırsanız faydalı ve doğru bir kullanım olacaktır. Eğer sitenizi ya da başka birşeyi paylaşmak istiyorsanız diğer tüm typeları Validate sayfasını açtığınızda gelen seçeneklerden karar verebilirsiniz.
<meta name="twitter:site" content="@emredardagan"> <– Sitenin hangi kullanıcıya ait olduğunu göstermek için kullanılır.
<meta name="twitter:title" content=""> <– Buraya sayfanın title bilgisi gelmeli (Otomatiğe bağlama imkanınız var ise hiç düşünmeden bağlayın.
<meta name="twitter:description" content=""> <– Buraya sayfanın title bilgisi gelmeli (Otomatiğe bağlama imkanınız var ise hiç düşünmeden bağlayın.
<meta name="twitter:creator" content="@emredardagan"> <– Paylaşılan sayfayı oluşturan kişinin kim olduğunu göstermek için kullanılır.
<meta name="twitter:image:src" content=""> <– Burası paylaştığınızda haber satırının yanında göstereceği resimdir. Otomatiğe bağlayıp paylaştığınız yazının bannerını almasını sağlayabilirsiniz. Ya da tek bir resim seçerek logonuz olabilir mesela onu gösterebilirsiniz.
<meta name="twitter:domain" content="http://www.emredardagan.com"> <– Sitenin domainini göstermek için kullanılır.

Kolay gelsin.
Teşekkürler.

Henüz yorum yok, ilk yorum yapan sen ol!

Cevapla

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