Apa sih tag meta kode twitter card itu? Apa fungsi dan kegunaan twitter card pada blogspot ini?
Ok kita merujuk ke laman resmi Introduction Twitter Cards.
With Twitter Cards, you can attach rich photos, videos and media experiences to Tweets, helping to drive traffic to your website. Simply add a few lines of markup to your webpage, and users who Tweet links to your content will have a “Card” added to the Tweet that’s visible to their followers.
Nah singkatnya kode tag meta twitter card ini berfungsi menyematkan judul, deskripsi dan gambar mini sesuai keinginan kita ketika di share oleh pengunjung atau pembaca artikel di blog.
Misalkan ane mengunjungi sebuah situs web blog, situs atau website.
Nah sudah ketemu kan intinya?
Cara Pasang Kode Tag Meta Twitter Card Blogger Blogspot
1. Buka Blogger > Edit HTML
2. Cari kode </head> dengan cara CTRL + F
3. Copy kode dibawah ini:
<meta name=’twitter:url’ expr:content=’data:blog.canonicalUrl’/>
<meta name=”twitter:title” expr:content=’data:blog.pageName’/>
<b:if cond=’data:blog.metaDescription’>
<meta name=”twitter:description” expr:content=’data:blog.metaDescription’ />
<b:else/>
<meta expr:content=’"Hey! Yuk baca artikel terbaru kita yang menceritakan tentang " + data:blog.pageName + " ini langsung di situs resminya disini " + data:blog.title + ""’ name=”twitter:description”/>
</b:if>
</b:if>
<b:if cond=’data:blog.postImageThumbnailUrl’>
<meta expr:content=’data:blog.postThumbnailUrl’ name=”twitter:image:src”/>
<b:else/>
<b:if cond=’data:blog.postImageUrl’>
<meta expr:content=’data:blog.postImageUrl’ name=”twitter:image:src”/>
<b:else/>
<meta name=”twitter:image:src” content=’link gambar default‘ />
</b:if>
</b:if>
<meta name=’twitter:card’ content=’xxxxxxxxxxxxx‘/>
<meta name=’twitter:creator’ content=’@username‘ />
4. Paste diatas kode </head> tadi
PERHATIAN
Nggak sampai disitu saja karena agan harus tahu juga apa2 saja fungsi dari kode2 diatas. Jangan asal nyeplak toh nanti takutnya tampilan share content gak sesuai sama keinginan.
Pada kode dibawah ini (sudah terpasang di kode atas) bisa agan sesuaikan apakah bentuknya summary, summary large image dan photo (penggunaan keterangannya baca dibawah).
Kalau kodenya hanya “summary” itu artinya disertakannya thumbnail saja.
Ane sudah menguji dan mencobanya satu per satu; dan menurut ane yang paling bagus dan greget adalah kode “summary_large_image” tag meta twitter card.
Untuk mengujinya sendiri agan bisa berkunjung ke laman ini, Card Validator Twitter Developers.
Ada juga kode berwarna seperti ini yang berfungsi untuk menyimpan informasi link URL domain artikel blog kita yang di share oleh pembaca.
Selanjutnya agan bisa mengubah “link gambar default” yang telah ditandai untuk memasang gambar default apabila di dalam posting blog tersebut tidak ada gambar. Jadi gambar inilah yang akan mewakili artikel yang dibagikan di twitter tersebut.
Nah pada kode dibawah ini:
Itu artinya deskripsi default; maksudnya apabila konten blog tsb tidak punya deskripsi, deskripsi inilah yang akan mewakili itu semua (yang muncul di hasil share artikel di twitter).
Terimakasih telah membaca di Aopok.com, semoga bermanfaat dan lihat juga di situs berkualitas dan paling populer Piool.com, peluang bisnis online Topbisnisonline.com dan join di komunitas Topoin.com.
