Twitter Card Open Graph di Blogger

Ustadz Online

Selasa, 14 April 2015

Twitter Card Open Graph di Blogger ini berfungsi untuk menampilkan summary dan image dari postingan artikel blog kita ketika dishare di Twitter. Ini sama dengan Facebook open graph. Caranya sebagai berikut:

CARA MEMBUAT TWITTER CARD

1. Buka blogger.com
2. Pada blog yang akan diedit, klik Template -> Edit HTML
3. Cari kode <head>
4. Copy dan paste kode berikut di bawahnya kode no. 3

<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.metaDescription'>
<meta content='summary' name='twitter:card'/>
<meta content='@agamakonsultasi' name='twitter:site'/>
<meta content='@agamakonsultasi' name='twitter:creator'/>
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' name='twitter:image:src' />
</b:if>
</b:if>
</b:if>

5. Ganti @agamakonsultasi dengan akun twitter anda.
6. Klik Simpan Template. Selesai.

CARA VALIDASI

Untuk mengetes apakah sudah benar, ada dua cara:

Pertama, kunjungi link ini dan masukkan link salah satu posting artikel blog anda.

Kalau sukses, maka akan tampak seperti dalam screenshot di bawah ini (klik untuk memperbesar):

Kedua, cara kedua, submit artikel blog anda langsung di Twitter.