Blogger Facebook Opengraph ve Twitter Cards Ayarları

blogger facebook opengraph ve twitter cards ayarlarıHatırlar mısınız bundan yıllar önce yazılarımızı facebook veya twitter'da paylaştığımızda çok kötü bir görüntü oluşurdu. Yazılarla alakasız resimler çıkardı ve yazıya ait resimler çok küçük dururdu. Bu nedenle paylaşımlar kimsenin ilgisini çekmezdi.

Zaman geçti, bu sosyal medya platformları kendilerini geliştirdi ve websitelerin paylaşımlarını daha ilgi çekici hale getirmenin yolunu buldu: Open Graph ve Twitter Card. Bu isimler sosyal medya sitelerinin paylaşımları daha ilgi çekici hale getiren teknolojilerinin adı. Birkaç meta kodunu temamıza ekleyerek sosyal medya paylaşımlarındaki küçük resim sorununu çözebiliyoruz.

Bu teknoloji sayesinde artık paylaşımlar kullanıcıların daha çok ilgisini çekiyor. Bunu da paylaşımlardaki büyük görseller sağlıyor. Ayrıca Facebook OpenGraph ve Twitter Cards sayesinde paylaşımlarımızdaki resimleri seçebiliyor ve yazara ait diğer bilgileri de ekleyebiliyoruz.

Facebook Opengraph ve Twitter Cards tam olarak ne işe yarıyor diye merak ediyorsanız aşağıdaki görselleri inceleyebilirsiniz. Twitter ve Facebook'da sürekli karşınıza çıkan o büyük görselli paylaşımlar bu sayede mümkündür. Bazen facebook yada twitter'da bir yazınızı paylaştığınızda resim çıkmama sorununu da Opengraph ve Cards özelliği sayesinde çözebilirsiniz.

Facebook Opengraph

blogger facebook opengraph


Twitter Cards

blogger twitter cards

Bu iki sitede de yazı paylaşırken artık görselleriniz yazının solunda sönük bir şekilde değil, üstünde daha ilgi çekici şekilde görüntülenecek. Daha profesyonel bir görünüm elde edeceksiniz hem de ziyaretçi sayınız artmış olacak.

Facebook Opengraph ve Twitter Cards ayarlarını bloğunuza uygulamak için;

Blogger > Tema > HTML'yi Düzenle bölümünde <head> kodunu bulun ve hemen üzerine aşağıdaki kodları ekleyin. Kodların içinde bütün ayarlar bulunuyor ve hiçbir değişiklik yapmanıza gerek yok.

[<!-- Twitter Card -->
<meta content='summary_large_image' name='twitter:card'/>
<!-- Title, URL & Description -->
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<meta expr:content='data:blog.url' name='twitter:url'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
<b:else/>
<meta expr:content='data:post.snippet' name='twitter:description'/>
</b:if>
<!-- Image -->
<b:if cond=' data:blog.postImageUrl'>
<meta expr:content=' data:blog.postImageUrl' name='twitter:image'/>
<meta property='twitter:image:width' content='280'/>
<meta property='twitter:image:height' content='150'/>
</b:if>

<!-- Facebook OpenGraph -->
<meta content='article' property='og:type'/>
<meta expr:content='data:blog.title' property='og:site_name'/>
<!-- Title, URL & Description -->
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' name='og:description'/>
<b:else/>
<meta expr:content='data:post.snippet' name='og:description'/>
</b:if>
<!-- Image -->
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<meta property='og:image:width' content='1200'/>
<meta property='og:image:height' content='630'/>
</b:if>]

Kodları uygun bölüme ekleyip temanızı kaydettikten sonra bir yazınıza gidin ve deneme olarak facebook ve twitter'da paylaşın. Yazıya ait görseller büyük olarak görüntülenecektir.

Eğer kodları eklemenize rağmen çalışmadıysa bu ayarlar sitenize eklendikten sonraki yazılarda etkili olacak demektir. Deneme amaçlı bir yazı girip görsel de ekleyerek tekrar deneme yapabilirsiniz.

İyi bloglamalar!

YORUMLAR

BLOGGER
301 yönlendirmesi,1,301 yönlendirmesi hakkında,1,301 yönlendirmesi nasıl yapılır,1,301 yönlendirmesi nedir,1,Adsense,12,adsense banka doğrulama,1,adsense banka ekleme,1,adsense iban ekleme,1,adsense onay,1,Adsense onaylatma,1,adsense ödeme duraklatıldı,1,Adwords,3,affiliate marketing,2,affiliate marketing nasıl yapılır,1,affiliate marketing nedir,1,Airties Modem Şifresi,1,akıllı cep telefonu,7,akıllı saat,1,akıllı televizyon,3,alan adı,1,alternatif kazanç,1,Anadolu Jet ucuz uçak biletleri,1,Analytics,2,Android,1,Android Batarya,1,Android Batarya Kalibrasyonu,1,Android Oreo,1,Android Oreo 2018,1,Atatürk Kravat,1,Başkasına Nasıl Kontör Gönderilir,1,Bayilik Veren Firmalar,1,bilgisayar,3,Bios,1,Bitcoin,3,Blog,1,blog yazmak,1,Blogger,71,blogger para kazanmak,1,blogger taşıma,1,blogger temaları,1,blogger teması,1,Blogger yardım,1,Blogger'dan WordPress geçiş,1,canlı tv,1,canlı tv izle,1,CDN,1,cloudflare,4,cloudflare ayar,1,cloudflare ayarlama,1,cloudflare kaldırma,1,cloudflare kurulumu,1,cloudflare nasıl kurulur,1,cloudflare nedir,1,cloudflare özellikleri,1,cloudflare seo,1,cloudflare yardım,3,cloudflare zararları,1,Devlet,2,Diğer,3,domain,1,Donanım,8,drone,1,Elektronik Sigara,1,elektronik sigara modelleri,1,en sık yapılan hatalar,1,Facebook,11,FileZilla,1,filezilla kullanımı,1,filezilla kurulumu,1,filezilla nasıl kullanılır,1,filezilla nasıl kurulur,1,filezilla yardım,1,Firefox,1,Firefox Kayıtlı Olan Şifreleri Silme,1,Firefox’da Kayıtlı Form Verileri Nasıl Silinir,1,ftp kullanımı,1,Girişimcilik ve Kişisel Gelişim,1,Google,21,Google Adsense,2,Google Sandbox,1,Gözü Kaynak Almasına Hangi Damla İyi Gelir,1,Hesap,36,Hitman Sniper Hile Apk indir,1,hosting,2,Instagram,9,İnternet,12,İnternetten Para Kazanmak,23,iphone,1,işletim sistemi,1,kazanç,1,kontör gönderme,1,METİN2 7X,1,METİN2 7X HİLESİ,2,Minecraft Apk indir,1,Mobil,11,modem arayüz girişi,1,modem şifreleri,1,Mouse ile seçilen metnin rengi nasıl değiştirilir,1,müzik indirme,1,nasıl site açılır,1,Office,2,on-page seo,1,onepage tema,1,Oyun,43,profil resmi gizleme,1,reseller hosting,1,samsung,1,samsung tablet,1,Sandbox,1,satış ortaklığı,3,satış ortaklığı firmaları,1,satış ortaklığı nasıl yapılır,2,satış ortaklığı nedir,1,Schema Lite,1,SEO,12,seo hataları,2,seo hatası,2,servis sağlayıcısı,1,seyahat önerileri,1,Simcity Buildit Hile Apk indir,1,Site içi seo,1,sunucu,1,swarm,1,Tanıtım,1,tek sayfa tema,1,Terminal Servisleri,1,Tplink Modem Şifresi ve Arayüze Erişim,1,tüm modem şifreleri,1,Twitter,10,ucuz uçak bileti,1,uçuş bilgileri,1,ücretsiz blogger teması,1,ücretsiz indir,2,ücretsiz tema,3,vodafone,1,Vodafone 2 Gb İnternet 1 TL,1,vodafone tarife,1,Webmaster,31,Whatsapp,5,whatsapp profil resmi,1,whatsapp profil resmi gizleme,1,Windows 10,51,Windows 8,2,Windows 8 Biosa,1,Windows 8 Biosa Nasıl Girilir,1,Wordpress,17,Wordpress kurulumu,1,wordpress nasıl kurulur,1,WordPress Tema,2,wordpress yardım,2,Yazılım,58,Youtube,18,Yurt Dışı Uçuşlar,1,Yüksek Kaliteli Sayfa,1,
ltr
item
Teknik Blog | isa.gen.tr: Blogger Facebook Opengraph ve Twitter Cards Ayarları
Blogger Facebook Opengraph ve Twitter Cards Ayarları
https://2.bp.blogspot.com/-E3BsmpYHUY0/WfxqNE3ElAI/AAAAAAAACIY/X7SlZmpkagsrKQgqdf4mCbWhA1hhjF_aACLcBGAs/s640/blogger-open-graph-twitter-cards_1.jpg
https://2.bp.blogspot.com/-E3BsmpYHUY0/WfxqNE3ElAI/AAAAAAAACIY/X7SlZmpkagsrKQgqdf4mCbWhA1hhjF_aACLcBGAs/s72-c/blogger-open-graph-twitter-cards_1.jpg
Teknik Blog | isa.gen.tr
https://www.isa.gen.tr/2017/11/blogger-facebook-opengraph-ve-twitter-cards-ayarlari.html
https://www.isa.gen.tr/
https://www.isa.gen.tr/
https://www.isa.gen.tr/2017/11/blogger-facebook-opengraph-ve-twitter-cards-ayarlari.html
true
420692696674173166
UTF-8
Hepsi yüklendi! BUNA BENZER BAŞKA BİR YAZI YOK Tüm Yazılar Devamını oku Yanıtla İptal et SİL By Ana Sayfa SAYFALAR YAZILAR Tümünü Görüntüle BENZER YAZILAR KATEGORİ ARŞİV ARAMA YAP... TÜM YAZILAR Uygun bir sonuç bulunamadı Ana Sayfa Pazar Pazartesi Salı Çarşamba Perşembe Cuma Cumartesi Paz Pzt Sal Çar Per Cum Cmt Ocak Şubat Mart Nisan Mayıs Haziran Temmuz Ağustos Eylül Ekim Kasım Aralık Oca Şub Mar Nis Mayıs Haz Tem Ağu Eyl Eki Kas Ara Az önce 1 saat önce $$1$$ dakika önce 1 saat önce $$1$$ saat önce Dün $$1$$ gün önce $$1$$ hafta önce Ay önce Takipçiler Takip et THIS CONTENT IS PREMIUM Please share to unlock Kodları kopyala Tüm kodları seç Tüm kodlar kopyalandı Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy