Twitter has definitely progressed a
lot in making tweets come out in a more detailed manner. Twitter cards are the
recent advancement in the area of interactive tweets that would make your
tweeting memorable. Twitter has expanded its platform and now offers the ability to tweet in more than
2000 ways.
lot in making tweets come out in a more detailed manner. Twitter cards are the
recent advancement in the area of interactive tweets that would make your
tweeting memorable. Twitter has expanded its platform and now offers the ability to tweet in more than
2000 ways.
What Twitter Cards Can Do for You?
Twitter cards can help you expand
your tweet and display more content on it directly. It gives you more power and
flexibility regarding the visibility of content on the shared
tweets.Interactive presentation of tweets helps in increasing the number of
followers and driving more traffic to your website.
your tweet and display more content on it directly. It gives you more power and
flexibility regarding the visibility of content on the shared
tweets.Interactive presentation of tweets helps in increasing the number of
followers and driving more traffic to your website.
Types
Twitter has issued three card types
which are explained below:-
which are explained below:-
Summary – It includes a title, description, thumbnail image, and
Twitter account attribution.
Twitter account attribution.
Photo – It includes a Tweet sized photo card.
Player – It includes a Tweet sized video/audio/media player
card.
card.
 |
| Example of CNN Channel using Tweet Cards |
How to Enable Tweets to Use Twitter
Cards?
Cards?
To enable the shared tweets to use
the power of cards, you need to add a piece of HTML code on the head section of
your web page as specified below:-
the power of cards, you need to add a piece of HTML code on the head section of
your web page as specified below:-
<meta
name=”twitter:card” content=”summary”>
name=”twitter:card” content=”summary”>
Or
<meta
name=”twitter:card” content=”photo”>
name=”twitter:card” content=”photo”>
Or
<meta
name=”twitter:card” content=”player”>
name=”twitter:card” content=”player”>
Additional Information
Apart from the main tag, you need to
specify some additional information associated with each of the Twitter card
types as mentioned below:-
specify some additional information associated with each of the Twitter card
types as mentioned below:-
For Summary Card
<meta
name=”twitter:card” content=”summary”>
name=”twitter:card” content=”summary”>
<meta
name=”twitter:site” content=”@seosandwitch”>
name=”twitter:site” content=”@seosandwitch”>
<meta
name=”twitter:creator” content=”@seoforu”>
name=”twitter:creator” content=”@seoforu”>
<meta
name=”twitter:url”
content=”Your Main Url”>
name=”twitter:url”
content=”Your Main Url”>
<meta
name=”twitter:title” content=”Tweet Title”>
name=”twitter:title” content=”Tweet Title”>
<meta
name=”twitter:description” content=”Tweet Description”>
name=”twitter:description” content=”Tweet Description”>
<meta
name=”twitter:image”
content=”Tweet Image Url”>
name=”twitter:image”
content=”Tweet Image Url”>
For Photo Card
<meta name=“twitter:card” content=“photo”>
<meta name=“twitter:site” content=“@seosandwitch”>
<meta name=“twitter:creator” content=“@seoforu”>
<meta name=“twitter:url” content=“Your Main Photo Url“>
<meta
name=”twitter:title” content=”Tweet Title”>
<meta
name=”twitter:description” content=”Tweet Description”>
name=”twitter:description” content=”Tweet Description”>
<meta
name=”twitter:image”
content=”Tweet Image Url”>
name=”twitter:image”
content=”Tweet Image Url”>
<meta name=“twitter:image:width” content=“610”>
<meta name=“twitter:image:height” content=“610”>
For Player Card
<meta name=“twitter:card” content=“player”>
<meta name=“twitter:site” content=“@seosandwitch”>
<meta name=“twitter:url” content=“Your Main Video Url“>
<meta
name=”twitter:title” content=”Tweet Title”>
name=”twitter:title” content=”Tweet Title”>
<meta
name=”twitter:description” content=”Tweet Description”>
name=”twitter:description” content=”Tweet Description”>
<meta
name=”twitter:image”
content=”Tweet Image Url”>
name=”twitter:image”
content=”Tweet Image Url”>
<meta name=“twitter:player” content=“https://example.com/embed/a”>
<meta name=“twitter:player:width” content=“435”>
<meta name=“twitter:player:height” content=“251”>
You may customize your tweets based on the examples provided above.
After you have added the specified code in the web pages, you may check your main url by using the preview tool given below:-
References:-
More information on how to use Twitter cards can be found by visiting the links shared below :-
http://dev.twitter.com/docs/cards
http://dev.twitter.com/docs/cards
