Summary Card with Large Image

The Summary Card with Large Image features a large, full-width prominent image alongside a tweet. It is designed to give the reader a rich photo experience, and clicking on the image brings the user to your website.

The Tweet below from @TechCrunch shows a Summary Card with Large Image along with the 140 characters:

Everything you need to know about the Amazon Fire Phone http://t.co/uULA47di9M
— TechCrunch (@TechCrunch) July 23, 2014

On twitter.com and our mobile clients, the image appears below the tweet text.

Our system recognizes when URLs are included in a tweet, and crawls your site to fetch the Card type and content. To learn more about how our Card system works, read our Getting Started Guide.

Sample Code

Adding a Summary Card with Large Image to your tweets is as simple as adding the below meta tags to your site:

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@nytimes">
<meta name="twitter:creator" content="@SarahMaslinNir">
<meta name="twitter:title" content="Parade of Fans for Houston’s Funeral">
<meta name="twitter:description" content="NEWARK - The guest list and parade of limousines with celebrities emerging from them seemed more suited to a red carpet event in Hollywood or New York than than a gritty stretch of Sussex Avenue near the former site of the James M. Baxter Terrace public housing project here.">
<meta name="twitter:image" content="http://graphics8.nytimes.com/images/2012/02/19/us/19whitney-span/19whitney-span-articleLarge.jpg">

Be sure to provide your own site attribution and content.

Once the tags are live, you can test your Card using our Twitter Card Validator.

Reference

Below are the suggested minimum properties for the Summary Card with Large Image including title, description, and image.

Card Property	Required
`twitter:card` Should be set to a value of “summary_large_image”	Yes
`twitter:site` The Twitter @username the card should be attributed to. Required for Twitter Card analytics.	Yes
`twitter:title` A concise title for the related content. Platform specific behaviors: iOS, Web: Truncated to one line in timeline and expanded Tweet Android: Truncated to two lines in timeline and expanded Tweet	Yes
`twitter:description` A description that concisely summarizes the content as appropriate for presentation within a Tweet. You should not re-use the title as the description or use this field to describe the general services provided by the website. Platform specific behaviors: iOS: Truncated to one line in timeline and expanded Tweet Android: Not displayed Web: Truncated to two lines in timeline and expanded Tweet	Yes
`twitter:image` A URL to a unique image representing the content of the page. You should not use a generic image such as your website logo, author photo, or other image that spans multiple pages. Images for this Card should be at least 280px in width, and at least 150px in height. Image must be less than 1MB in size.	No
`twitter:image:alt` A text description of the image conveying the essential nature of an image to users who are visually impaired.	No

For a full list of supported tags, please see the Cards Markup Tag Reference.

Mappings from the Photo Card

Photo Cards were deprecated and mapped to Summary Cards with Large Image. If Photo Card metatags are still in use, this table shows how those fields are used to display a Summary Card in its place.

Card Property	Photo Card Property
`twitter:image`	`twitter:image`
`twitter:title`	`twitter:title*, og:title` Card will not render if properties are not found.
`twitter:description`	`og:description, twitter:site`

*Title is optional and the description is not a field for the Photo Card.

Mappings from Gallery Card

Gallery Cards were deprecated and mapped to Summary Cards with Large Image. If Gallery Card metatags are still in use, this table shows how those fields are used to display a Summary Card in its place.

Card Property	Gallery Card Property
`twitter:image`	`twitter:image0`
`twitter:title`	`twitter:title`
`twitter:description`	`og:description, twitter:site`

Mar	JUN	Oct
	20
2015	2016	2017