Twitter Card for Blog (TCB)

What is a Twitter Card?

With Twitter Cards, you can attach photos, videos, and rich media experiences to your Tweets, helping drive traffic to your website. Just add a few lines of markup to your web page, and users who Tweet a link to your content will have a “Card” added to the Tweet that’s visible to their followers.

// 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"/>
  ';

The results will be more or less like this when other people share your blog posts.

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

Just to add, at that time when I was still playing around on my grandfather's platform (blogcepot), this is the widget that I embedded.

<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>