Product Card

This Card was DEPRECATED on July 3, 2015 and has been mapped to the Summary Card.

The Product Card is a great way to represent product and retail items on Twitter. This Card type is designed to showcase your products via an image, a description, and allow you to highlight two other key details about your product.

The Tweet below from @iHeartRadio shows a Photo Card below the 140 characters:

image0

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.

The Product Card requires an image of size 160 x 160 or greater. It prefers a square image but we crop/resize oddly shaped images to fit as long as both dimensions are greater than or equal to 160 pixels.

Sample Code

Adding a Product Card to your tweets is as simple as adding the below meta tags to your site:

<meta name="twitter:card" content="product">
<meta name="twitter:site" content="@iHeartRadio">
<meta name="twitter:creator" content="@iHeartRadio">
<meta name="twitter:title" content="24/7 Beatles — Celebrating 50 years of Beatlemania">
<meta name="twitter:image" content="http://radioedit.iheart.com/service/img/nop()/assets/images/05fbb21d-e5c6-4dfc-af2b-b1056e82a745.png">
<meta name="twitter:label1" content="Genre">
<meta name="twitter:data1" content="Classic Rock">
<meta name="twitter:label2" content="Location">
<meta name="twitter:data2" content="National">

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.

App Downloads and Deep Linking

In addition to displaying your content in a more engaging way, the Summary Card can also drive downloads of and even link directly into your mobile applications. For more information, see Cards for Mobile Developers.

Additionally, you can learn how to deep-link from this Card into your mobile app by reading here.

Reference

Define the product card with these properties:

Card Property Required
twitter:card

Must be set to a value of “product”

Yes
twitter:site

The Twitter @username the card should be attributed to.

Yes
twitter:title

The title of your content as it should appear in the card. You may specify an empty string if you wish no title to render.

Yes
twitter:description

A description of the content in a maximum of 200 characters

Yes
twitter:image

A URL to the image representing the content. Image must be less than 1MB in size. The image will be cropped to a 1:1 aspect ratio.

Yes
twitter:image:width

Providing width in px helps us more accurately preserve the the aspect ratio of the image when resizing

No
twitter:image:height

Providing height in px helps us more accurately preserve the the aspect ratio of the image when resizing

No
``twitter:data1 ``

This field expects a string, and you can specify values for labels such as price, items in stock, sizes, etc

Yes
``twitter:label1 ``

This field also expects a string, and allows you to specify the types of data you want to offer (price, country, etc.)

Yes
``twitter:data2 ``

This field expects a string, and you can specify values for labels such as price, items in stock, sizes, etc

Yes
``twitter:label2 ``

This field also expects a string, and allows you to specify the types of data you want to offer (price, country, etc.)

Yes

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