Twitter Card Generator

Twitter Card Generator

Generate Twitter cards markup and improve yours html meta

Use the Twitter Card Generator to create a huge impact of social traffic on your website: add Twitter Card tags and drive traffic when it's shared on Twitter

Fill in the form

Card type *

The card type. Only one card type per-page is supported.

Site username

Indicates the Twitter account on which the content was published.

Title

Up to 70 characters

Description

Up to 200 characters

What is a Twitter Card?

How does a Twitter Cards work?

With Twitter Cards, you can attach rich photos, videos and media experiences to Tweets, helping to drive traffic to your website.

Using the Twitter Card Generator tool simply add a few lines of markup to your webpage, and users who Tweet links to your content will have a "Card" added to the Tweet that's visible to their followers.

Cards are larger and more engaging that a standard tweet. They feature a summary or summary with large image attached to your tweet but unlike normal image attachments that open up a larger version of the image, clicking on the image in a Website Card will send users to your landing page.

Cards drive engagement from your Tweets to your site with different types both for desktop and mobile devices:

Summary Card
The Twitter Summary Card display title, description and thumbnail. It can be used for many kinds of web content, from static page to a blog posts, from ecommerce to news articles, to products and restaurants. It is designed to give users a preview of the content before clicking through to your website.

Summary Card with large image
The Twitter Summary Card with Large Image display a prominently-featured image follow by title and description. It is designed to give users a rich photo experience, and clicking on the image brings them to your website.

APP Card
This card drive user directly to a mobile app download. The App Card is a great way to represent mobile applications on Twitter and to drive installs. App Card allow for a name, description and icon, and also to highlight attributes such as the rating and the price.

Player Card
This card display video player, audio player and rich media. By implementing a few HTML meta tags to your website you can deliver your rich media to users across the net.

Information and examples

Let's diving into each parameter

The following table gives you an explanation of each of the meta used in this tool to generate Twitter Cards.

Card

Required

This tag specify the twitter card type:

  • Summary card
  • Summary with large image
  • App card
  • Player card
<meta name="twitter:card" content="summary">

Site

Required in app and player card type

The Twitter @username the card should be attributed to.

Title

Required in summary with image and player card type

A concise title for the related content. Platform specific behaviors:

  • iOS, Android: Truncated to two lines in timeline and expanded Tweet
  • Web: Truncated to one line in timeline and expanded Tweet

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, Android: Not displayed
  • Web: Truncated to three lines in timeline and expanded Tweet

Image

Required in player card type

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 support an aspect ratio of 1:1 with minimum dimensions of 144x144 or maximum of 4096x4096 pixels.

Images must be less than 5MB in size. The image will be cropped to a square on all platforms. JPG, PNG, WEBP and GIF formats are supported. Only the first frame of an animated GIF will be used. SVG is not supported.

App name

A concise title for the related app content.

App 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 app.

App iPhone ID

Required in app card type

String value, and should be the numeric representation of your app ID in the App Store
e.g. "307234931".

App iPad ID

Required in app card type

String value, should be the numeric representation of your app ID in the App Store
e.g. "307234931".

App Google Play ID

Required in app card type

String value, should be the numeric representation of your app ID in Google Play
e.g. "com.android.app".

App iPhone URL

Your app's custom URL scheme (you must include "://" after your scheme name)

App iPad URL

Your app's custom URL scheme

App Google Play URL

Your app's custom URL scheme

App Country URL

If your application is not available in the US App Store, you must set this value to the two-letter country code for the App Store that contains your application.

Player URL

Required in player card type

HTTPS URL to iFrame player. This must be a HTTPS URL which does not generate active mixed content warnings in a web browser. The audio or video player must not require plugins such as Adobe Flash.

Player width

Required in player card type

Width of iFrame specified in twitter:player in pixels.

Player height

Required in player card type

Height of iFrame specified in twitter:player in pixels.

Share this tool

Did u like it? Share it!

Related tools

Try these one!
Validate your AMP pages

AMP VALIDATOR

Validate your AMP pages with this tool.

Test your Accelerated Mobile Pages, get detailed report and optimize performance.

GO VALIDATE
Network requests and timeline waterfall

NETWORK WATERFALL

Capture web page requests and timeline waterfall.

Quickly capture and analyze web page network requests during page load.

GO ANALYZE
Test your page structured data

STRUCTURED DATA TEST

Test your web pages structured data.

Check conformity of your structured data json-ld and improve your SEO.

GO TESTING
Test your page speed insights

PAGESPEED INSIGHTS

Analyze your web page speed performance.

Retrieve information about speed index, latency, first contentful paint and more.

GO ANALYZE