What Is a Twitter Card and How to Set One Up

October 17, 2026 • NOFYI Editorial Team

When you share a link on X, formerly known as Twitter, you may notice that some links appear as plain text while others appear with a title, a short description, and a large image. That richer preview is called a Twitter Card. It is not created by the post you write on X. It is created by small pieces of information, called meta tags, that live in the code of the page you are linking to. When someone shares that page, X reads those tags and uses them to build the preview.

This guide explains what a Twitter Card is, the difference between a summary card and a summary card with a large image, the main tags you need, and how to set one up step by step. It includes a worked example for a chocolate cake page, advice on choosing a 1200 by 630 image, and how to test your card with the Card Validator. It also explains why Twitter may cache an old card and what to do about it.

You do not need to be a developer to understand Twitter Cards, but you will need access to your site settings or a plugin that lets you control them. On many sites, an SEO plugin such as Rank Math or Yoast can set these tags for you. If you manage a site by hand, you can add the tags to the page yourself. Either way, the ideas are the same: give X a clear title, a short description, and a suitable image, and check the result before you share the link widely.

What Is a Twitter Card?

A Twitter Card is a preview format that X uses when a link is shared. Without card tags, a shared link may show only the URL, or a basic preview taken from the page. With card tags, X can show a structured preview that includes a title, a description, and an image. That preview helps readers decide whether to click. It also helps your link stand out in a busy feed, where many posts compete for attention.

Twitter Cards are based on meta tags in the head section of a web page. The head section is the part of the page code that visitors do not see directly, but browsers and social platforms read it. Each tag has a name and a content value. For example, one tag tells X which card type to use. Another tag gives the title. Another gives the description. Another gives the image URL. X reads those tags when the link is first shared or when it is checked with a validator tool.

It is important to understand that a Twitter Card does not change the page itself. It changes how the page looks when it is shared on X. The page title on your site, the headings, and the body text stay the same. The card tags are extra information for sharing. If you change the card tags, you do not need to rewrite the page. You only need to make sure the tags match the page and that X picks up the new version.

Summary Card and Summary Card With a Large Image

There are two main Twitter Card types that most site owners use: summary and summary_large_image. They look different and suit different kinds of content.

Summary card

A summary card shows a small square image on one side and a title and description next to it. The image is smaller, so the card takes up less space in the feed. This format works well for pages where the image is helpful but not the main attraction, such as a short news update, a simple how-to page, a documentation page, or a page where the text matters more than the picture. It is also a sensible choice when you do not have a wide, high-quality image for the page.

Summary card with a large image

A summary_large_image card shows a wide image above the title and description. The image is much larger and more prominent. This format works well for pages where the image helps tell the story, such as a recipe, a travel guide, a product page, a photo essay, or an announcement with a strong visual. Because the image is large, it needs to be clear, well-composed, and correctly sized. A blurry or badly cropped large image will be more noticeable than a blurry small image.

Choosing between the two is a practical decision, not a technical one. Ask what a reader needs to decide whether to click. If the image is the reason to click, use the large image card. If the title and description are the reason to click, the summary card may be enough. For many blog posts and articles, the large image card is the common choice, because a good featured image helps the post stand out. For pages without a strong image, the summary card is the safer choice.

The Main Twitter Card Tags

Each Twitter Card is built from a small set of tags. The names use the prefix twitter. Here are the main ones you will see.

twitter:card tells X which card type to use. The value is usually summary or summary_large_image. This tag is required. If it is missing or misspelled, X may not show a card at all, or may fall back to a basic preview.

twitter:title gives the title shown in the card. Keep it clear and accurate. It can be the same as the page title, or a slightly shorter version that fits the card. Avoid clickbait or a title that does not match the page, because readers will notice the mismatch when they click through.

twitter:description gives a short summary of the page. Keep it to one or two sentences. Explain what the reader will find and why it matters. Avoid repeating the title word for word if you can, because the card already shows the title above the description.

twitter:image gives the full URL of the image to show in the card. Use an absolute URL, which means the full address starting with https, not a relative path such as /images/cake.jpg. X needs the full address to fetch the image. If the URL is wrong, the image will not appear.

There are other optional tags, such as twitter:site for the site account and twitter:creator for the author account. These can help with attribution, but they are not required for a basic card. If you use them, use the correct account names and include the @ symbol as the format requires.

One point that confuses many people is the relationship between Twitter Cards and Open Graph tags. Open Graph tags use the prefix og, such as og:title and og:image, and are used by many platforms. X can fall back to Open Graph tags for some values if Twitter tags are missing, but it is better to set both sets of tags when you can, so each platform gets clear information. This guide focuses on Twitter tags. A separate guide on Open Graph tags covers that system in more detail.

How to Set Up a Twitter Card

Setting up a Twitter Card has four parts: choose the card type, prepare the image, add the tags, and test the result. Work through them in order.

Step 1: Choose the card type

Decide whether the page should use summary or summary_large_image. Look at the page and ask whether you have a strong wide image. If you do, choose summary_large_image. If you do not, choose summary. Write down your choice, because you will need it for the card tag.

Step 2: Prepare the image

For a large image card, prepare an image that is 1200 by 630 pixels. That size is widely recommended for large social preview images, because it fits the wide shape of the card and stays clear on most screens. Use a clear, relevant image that represents the page. Avoid text that is too small to read, because it will be hard to read in the card. Avoid a busy image with many competing details. Keep the main subject in the center, with a little space around it, so cropping does not cut it off.

For a summary card, use a square or near-square image. Make sure the image is clear at small sizes. A logo, a simple illustration, or a cropped photo can work. Do not use an image that is mostly blank or mostly text.

Save the image in a common format, such as JPG or PNG, and upload it to your site so it has a public URL. Copy the full URL and check that it opens in a browser. If the URL requires a login or is on a private server, X will not be able to fetch it.

Step 3: Add the tags

If you use a plugin, open the page in your site editor and find the social or SEO settings for that page. Look for a section for Twitter or X. Choose the card type, enter the title and description, and select the image. Save the page. The plugin will generate the tags for you. Check that the plugin is not using a default image from another page by mistake.

If you add tags by hand, add them to the head section of the page. Keep the tags together so they are easy to find later. Use the correct tag names and the full image URL. Save the page and check that the tags are present by viewing the page source in your browser. Do not add the same tag twice with different values, because that can confuse the platform reading it.

Step 4: Test the card

Use the Card Validator to check the card before you share the link widely. Paste the page URL into the validator and run the check. The validator will show a preview of the card and list any problems it finds. Fix any errors, save the page, and run the check again. Do not rely on sharing the link in a post to test it, because that can publish a broken preview to your followers.

Worked Example: A Chocolate Cake Page

Imagine you have a page called How to Bake a Simple Chocolate Cake. The page has a recipe, a list of ingredients, and step-by-step instructions. You want the link to look appealing when it is shared on X. Here is how you would set up the card.

First, choose the card type. The page has a strong photo of a chocolate cake on a plate, with a slice cut out. The photo is the reason many readers will click, so you choose summary_large_image.

Second, prepare the image. You take the cake photo and crop it to 1200 by 630 pixels. The cake stays in the center, with a little space around it. The photo is bright and clear, and it does not have small text that would be hard to read. You upload the image to your site and copy the full URL, for example https://example.com/images/chocolate-cake-1200×630.jpg. You open that URL in a browser to confirm that the image loads.

Third, write the title and description. The title is How to Bake a Simple Chocolate Cake. The description is: A clear, step-by-step recipe for a soft chocolate cake, with ingredients, timing, and tips for a clean slice. That description is short, accurate, and tells the reader what to expect. It does not repeat the title word for word.

Fourth, add the tags. Using a plugin or by hand, you set twitter:card to summary_large_image, twitter:title to the title above, twitter:description to the description above, and twitter:image to the full image URL. You save the page.

Fifth, test the card. You paste the page URL into the Card Validator. The preview shows the wide cake photo above the title and description. The title is not cut off in a confusing way, and the description reads clearly. You fix nothing, because the preview looks correct. You then share the link on X, knowing what readers will see.

If the preview had shown the wrong image, you would check the image URL, confirm that the image is public, and check that no other tag is overriding it. If the preview had shown no image, you would check that the image URL is absolute, that the image is the right size, and that the file is not blocked. This example follows a pattern you can reuse: choose the type, prepare the image, write clear text, add the tags, and test.

How to Test With the Card Validator

The Card Validator is a tool provided by X for checking how a link will appear as a card. To use it, open the validator, paste the full URL of the page you want to check, and run the check. The tool will fetch the page, read the card tags, and show a preview. It will also show warnings or errors if something is missing or incorrect.

Read the preview carefully. Check the title, description, and image. Check that the image is not stretched, cropped in a way that cuts off the subject, or missing. Check that the title is not cut off mid-word in a way that changes its meaning. If the tool shows an error, read the message and fix the tag it refers to. Common errors include a missing card type, a missing image, an image URL that cannot be fetched, or an image that is too small.

After you fix a problem, run the validator again. Do not assume the fix worked. The validator is the fastest way to confirm that X can read the updated tags. If the validator still shows the old card, the issue may be caching, which is covered below. If the validator shows the new card, you can share the link with more confidence.

Keep a note of what you tested. If you update the page later, test again. A change to the title, description, or image may not show up in old posts, but it should show up in new shares after the cache updates.

Twitter May Cache the Card

X may cache, or save, the card for a page after it first reads it. That means if you share a link, then change the title, description, or image, the old card may keep showing for a while. This is normal. It happens because X does not fetch the page fresh every time someone shares the link. It reuses the saved version to keep the service fast.

If you need to update a card, start by checking the Card Validator. In many cases, running the validator will prompt X to fetch the page again and update the cached card. If the validator shows the new card but an old post still shows the old card, that old post may keep the old preview. New shares should show the new card after the cache updates. If the validator still shows the old card, check that you saved the page, that the tags are correct, and that the page is not being served from a cache on your own site.

To reduce caching problems, test the card before you share the link widely. Set up the tags, test with the validator, fix any problems, and only then share the link. If you must change the card after sharing, update the tags, test again, and allow time for the cache to update. Avoid changing the card tags repeatedly in a short period, because that can make it harder to tell which version X has saved.

Also check your own site cache. If your site uses a caching plugin, the page X fetches may be an older cached version. Clear the site cache after you update the tags, then test with the validator again. This step is easy to miss and is a common reason why a fix does not seem to work.

Limitations

Twitter Cards have limits. They control the preview, not the content of the page. A good card will not make a weak page useful, and a good page can still be ignored if the card does not explain why it matters. The card is a preview, not a promise. Make sure the page delivers what the card says it will.

The validator can only check the page it can reach. If the page requires a login, is blocked by a firewall, or is on a local test server, X will not be able to fetch it. Test on a public page that anyone can open. If your site is still in development, wait until it is public before you test the card.

Image handling varies. X may crop or resize the image to fit the card format. An image that looks perfect on your site may look different in the card. Always check the preview, not just the source image. If the crop cuts off important detail, adjust the image and test again.

Finally, X may change its tools, formats, or requirements over time. The Card Validator may move or change its name, and the recommended image sizes may be updated. If a step in this guide does not match what you see, check the current documentation for X and for your plugin. The core idea stays the same: give X clear tags, a good image, and a tested preview.

Frequently Asked Questions

What is a Twitter Card?

A Twitter Card is a rich preview that X shows when a link is shared. It is built from meta tags in the page code, and it can include a title, a description, and an image. Without card tags, a link may show only a plain URL or a basic preview.

What is the difference between summary and summary_large_image?

A summary card shows a small image beside the title and description. A summary_large_image card shows a wide image above the title and description. Use the large image card when the image is a key reason to click, and the summary card when the text matters more or you do not have a strong wide image.

What size should a large Twitter Card image be?

Prepare a large image that is 1200 by 630 pixels. Use a clear, relevant image, keep the main subject centered, and use the full absolute URL for the image so X can fetch it. Test the card to check that the image is not badly cropped.

Why does my old card still show after I update it?

X may cache the card after it first reads the page, so the old version can keep showing for a while. Test the page with the Card Validator, clear your site cache if you use one, and allow time for the cache to update. Test before you share widely to reduce this problem.

Conclusion

A Twitter Card is a small set of tags with a clear job: help your link look clear and inviting when it is shared on X. Choose the right card type, prepare a good image, write an accurate title and description, add the tags, and test with the Card Validator. If the old card lingers, remember that caching is normal and check the validator again. With that routine, your links will present themselves clearly instead of appearing as bare URLs.