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.


Popular posts from this blog

AngularJs Tutorial: Getting Started

Abstract Factory design pattern analysis

AngularJs Tutorials : Bootstrap