Integrasi Twitter Card di Blog

Apa itu Twitter Card?

Dengan Kartu Twitter, Anda dapat melampirkan foto, video, dan pengalaman media yang kaya ke Tweet, membantu mengarahkan lalu lintas ke situs web Anda. Cukup tambahkan beberapa baris markup ke halaman web Anda, dan pengguna yang Tweet tautan ke konten Anda akan memiliki "Kartu" ditambahkan ke Tweet yang terlihat oleh pengikut mereka.

// Paste the following code right underneath <b:includable id='post' var='post'>
// and change the coloured text to your own information before saving.

<meta content='@gatewan' name='twitter:site'/>
<meta content='@gatewan' name='twitter:creator'/>
<meta content='www.gatewan.com' name='twitter:domain'/>
<b:if cond='data:post.firstImageUrl'>
<meta content='summary_large_image' name='twitter:card'/>
<meta expr:content='data:post.firstImageUrl' name='twitter:image'/>
<b:else/>
<meta content='summary' name='twitter:card'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' name='twitter:image'/>
</b:if>
</b:if>
<meta expr:content='data:post.title' name='twitter:title'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:post.snippet' name='twitter:description'/>
<b:else/>
<meta content='Rangkuman Cerita Rakyat' name='twitter:description'/>
</b:if>

  echo
  '
    <meta content="@bundetcom" name="twitter:site"/>
    <meta content="@bundetcom" name="twitter:creator"/>
    <meta content="bundet.com" name="twitter:domain"/>
    <meta content="summary_large_image" name="twitter:card"/>
    <meta content="'.$d->isi.'" name="twitter:image"/>
    <meta content="summary" name="twitter:card"/>
    <meta content="'.$d->judul.'" name="twitter:title"/>
    <meta content="'.$d->isi.'" name="twitter:description"/>
  ';

Nanti hasilnya kurang lebih akan seperti ini saat orang lain membagikan postingan blog Anda.

https://twitter.com/bundetcom/status/1305083148582023169?s=20

Sekedar tambahan, kala itu saat masih bermain-main di platfom simbah (blogcepot), ini widget yang pernah saya benamkan.

<a class="twitter-timeline" href="https://twitter.com/gatewan" data-widget-id="494062242032123904">Tweets by @gatewan</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>