Saturday, October 26, 2013

Twitter: How To Implement Summary Card


Hello Friends, this tutorial will help you to implement one of the Twitter card, Summary Card.


There are different cards available in Twitter. like

  • Summary
  • Photo
  • Product
  • Gallery
  • App
  • Player


Today we will see implementation of Summary Card.

Summary card gives preview of website to reader which get shared via twitter.
It is a rich snippet which display Title, Description and Image of shared website. 




To use summary card you need to add few meta tags in your webpage.

Follow the given step to get these meta tags

2.   Choose Twitter Card, which is Summary.


3.   Add meta information 

twitter:site (Site Twitter Username)
twitter:title (Site/Webpage Title)
twitter:description (Site/Webpage Description)
twitter:creator (Site Twitter Creator)
twitter:image:src (Site/Webpage Image)
twitter:domain (Site Domain) 



4.   Then select sample embed code and put it into head section of your site/webpage.

       

5.    After updating meta tags into your website visit validation section of Twitter Card and click on “Validate & Apply” button.



6.     It will ask for website URL , then past your website URL where you have recently updated summary card.



7.    Put that URL and click “Go!”

8.    If all goes well then it will show Summary card preview of right side.



9.    If something goes wrong then it will gives you warning.



Hope this tutorial will help to get start with Twitter’s Summary card.

Zainul Abedin Shaikh

Founder of Zainabed, Passionate about programming. Follow him on Twitter

And if you enjoyed this post, please consider sharing it on Facebook, Google+ or Twitter below