Beginner's guide to Twitter Cards

Twitter no longer limits its users to posting messages of 140 characters or less. Twitter Cards, or Expandable Tweets, enable users to enjoy a more interactive Twitter experience whilst offering publishers greater opportunity to convey their message to readers.

Implementing Twitter Cards on your website enables your followers to view photos, watch video clips, or read summaries from your web pages - all without having to leave Twitter.

Every second there are 9,100 tweets - make yours stand out using Twitter Cards!

Card types

There are already a number of different types of Twitter Cards available for use, and Twitter now offers lead-generation cards to select publishers.

The Summary Card is the default option, and it is the card that most widely used, though the Image, Photo, and Gallery cards have also proven popular. Before implementing Twitter Cards, you will need to choose the most appropriate format from the list below.

Summary Card

Summary Card

This is the default option. It will include a title and description, as well as a small thumbnail image and Twitter account attribution. It is well suited to pages geared towards text-based content.

Gallery Card

Gallery Card

If you want to display more than a single image, the Gallery Card is ideal. Choose up to four photos, add a standard tweet, and name the gallery.

Summary Card with Large Image

Summary Card with large image

This is similar to the default Summary Card, except that it replaces the small thumbnail with a large image. It's great for pages that have a single prominent or important image.

Player Card

Player Card

If you publish video or audio rather than static images, add a description, title, and a clickable media player to the Player Card.

Summary Card with Large Image

Photo Card

The Photo Card includes a card-sized photograph from your web page. This would be the best option for an image-based website such as a photography business.

Player Card

Product Card

Ideal for ecommerce websites, the Product Card allows for greater detail on a specific product. An image at least 160 x 160 in size is required for a Product Card.


How to implement Twitter Cards

Once you've chosen the type of Twitter Card you want to use, you will need to add the appropriate code to your chosen web page. Once the code is added to your page, you then need to validate the code and get approval from Twitter before it will go live. Without completing these steps, your Twitter Card will not be active.

Twitter Product Card example screenshot

Twitter Card preview screenshot

Getting your Twitter Card code

Twitter offers a handy tool to help generate the required Twitter Card code. First, visit the validator page at https://dev.twitter.com/docs/cards/validation/validator. From here, choose the type of card you wish to use. The next page is split into two parts; on the left hand side, there are fields of information required to generate the code needed, and on the right is a card preview. Once you have added in all the required fields on the left, hit “update preview” at the bottom of the page to get a preview of what your Twitter Card will look like.

If you are happy with your preview, simply select the entire code below the preview – this is the code you will need to add to your chosen web page.


Add the code to your web page

Now that you have the relevant code, you need to add it to your web page. This is fairly straightforward, but if you have no experience with HTML at all, you may need to consult your web designer. Simply copy and paste the code into your page header (between the <head></head> tags).


Validate your code

Once you’ve added the code, you will need to validate it.

Visit the validator page again at https://dev.twitter.com/docs/cards/validation/validator, and this time choose the “validate and apply” tab near the top of the page. Add in your page URL, and hit “go”. As long as it all checks out okay, you can then submit the code and page for validation by Twitter.

Typically, it takes around 5 to 10 days for validation to be completed, and Twitter will email you once your Twitter Card is active.

Make sure you use test your card once it has been approved just in case something has gone wrong.

Twitter Cards and your marketing campaign

Twitter Cards are a great way to get further information across to your followers in a single tweet. In addition to your regular 140 characters, you also receive room for more text, images and even video. All of this will help your tweets stand out in a crowded Twitter feed, and without a doubt improve the chances of people clicking through to your business website and engaging with your tweet!


Share this page:
Follow us for great tips: