Web Günlüğü

Blogger Twitter Cards Ayarları

Blogger veya blogspot bloglar için Twitter Cards ayarlarına-yapılandırmasına geçmeden önce öncelikle Twitter Cards nedir, ne işe yarar onun hakkında kısa bir bilgi edinelim. Twitter Cards Twitter geliştiricileri tarafından özellikle blog/site sahipleri için geliştirilmiş gelişmiş bir içerik paylaşma özelliği. Twitter Cards sayesinde Twitter'da paylaşılan bir bağlantının (linkin) o bağlantıya ait sayfa içeriğinde bulunan yazı başlığını yazının bir kısmını ve yazı içerisinde bulunan görseli otomatik olarak Twitter'da özet şeklinde paylaşmaya olanak sağlıyor.

Twitter'ın bu yeni özelliği Facebook ve Google+'tan da hatırlayacağımız gibi ileti alanında paylaştığımız herhangi bir linke ait sayfa içeriğinin özeti otomatik olarak paylaşılıyordu. Twitter her ne kadar bu konuda biraz geç kalmış olsa da yine de yolun sonu değil.

Twitter Cards özelliğini kullanabilmek biraz mazeretli ve zaman alan iş açıkçası. Twitter Cards özelliğini kullanabilmek için yapılacak olan işlemler sırasıyla aşağıdaki kodları  /head tagından önce yerleştirmek ve kendi blogunuza ve twitter hesabınıza göre özelleştirmek daha sonra ise Twitter üzerinden onaylama işlemi yapmak.

Blogger Twitter Cards Yapılandırması

1.Aşama
Aşağıdaki kodlar </head> kodundan önce eklemeli ve @zfrznt yazan yerleri kendi twitter kullanıcı isminizle değiştirmelisiniz. Ayrıca İlk sırada yer alan summary_large_image kart tipini belirtiyor. dev.twitter.com/cards/types adresinden de canlı olarak görebileceğiniz gibi bloglar için 2 farklı kart tipi bulunmakta summary küçük resimli olan benim daha çok hoşuma giden tip olan summary_large_image ise büyük resimli olan kart tipi.

<meta content='summary_large_image' name='twitter:card'/>
<meta content='@zfrznt' name='twitter:creator'/>
<meta content='@zfrznt' name='twitter:site'/>
<meta expr:content='data:blog.homepageUrl' name='twitter:domain'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.url' name='twitter:url'/>
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<meta expr:content='data:blog.postImageUrl' name='twitter:image'/>
<b:else/>
<meta expr:content='data:blog.homepageUrl' name='twitter:url'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
  <meta content='http://www.zaferzent.com/favicon.ico' name='twitter:image'/>
</b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
</b:if>
<meta expr:content='data:blog.Url' name='twitter:url'/>

2.Aşama
Aslında ikinci aşama yok en azından bana olmadığını görmüş oldum :) Sadece ayarlar yapıldıktan sonra twitter cards'ın çalışıp çalışmadığını test etmek için cards-dev.twitter.com/validator adresine bir test mekanizması kurulmuş. Farklı bir blogda deneme fırsatım olmadı ama ilk defa yapacaklar için de aynı sistem var mı bilmiyorum deneyip görebilirsiniz.


Bu yazı 25.10.2015 saat 03.15 sularında güncellenmiştir.