Skip to content

Twitter card (X card)

Also called X card, Twitter cards, twitter:card

What is a Twitter card?

A Twitter card, now often called an X card, is a set of <meta name="twitter:..."> tags that control how a link preview appears when someone posts it on X (formerly Twitter). The twitter:card tag sets the layout, most often summary (small square image) or summary_large_image (large image above the text). Other types are app and player.

X looks for its own tags first, such as twitter:title, twitter:description and twitter:image, and falls back to the matching Open Graph tags if they are missing. So many sites only add twitter:card plus Open Graph tags. Like Open Graph, Twitter cards don’t affect Google rankings.

Twitter card tags use the name attribute (name="twitter:card"), while Open Graph uses property (property="og:title"). Mixing them up is a common reason previews fail. X caches previews, so after changing tags you may need to wait or post a fresh URL to see the update. For search snippets, the meta description still does the work.

Why Twitter card matters for SEO

Posts with a large image preview take up more space in the feed and tend to draw more attention than bare links.

Without a twitter:card tag, X may show a minimal preview even if your Open Graph tags are present.

How to add a Twitter card

  1. Add <meta name="twitter:card" content="summary_large_image"> to the page’s <head>.
  2. Make sure Open Graph title, description and image tags are present, or add twitter:title, twitter:description and twitter:image.
  3. Optionally add twitter:site with your X handle.
  4. Post the link, or preview it in a draft, to check how it appears.

Twitter card example

HTML
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@example">
<meta name="twitter:title" content="How to make a sourdough starter">
<meta name="twitter:image" content="https://example.com/img/starter-og.jpg">

Twitter card FAQ

What is the difference between summary and summary_large_image?

summary shows a small square thumbnail next to the title; summary_large_image shows a wide image above the title. Most articles and product pages use summary_large_image.

Do I need Twitter card tags if I have Open Graph tags?

You need at least twitter:card to choose the layout. X falls back to Open Graph for the title, description and image.

Do Twitter cards help SEO?

Not for Google rankings. They improve how links look on X, which can bring more clicks and visibility.

Related SEO terms

  • Open Graph tags

    Open Graph tags are meta tags that control how a page looks when shared on social platforms and messaging apps: title, description and image.

  • Title tag

    A title tag is the HTML element that names a page. Google often uses it as the clickable headline in results, so it affects rankings and clicks.

  • Meta description

    A meta description is an HTML tag that summarises a page. Google may show it as the snippet under the title; it affects clicks, not rankings.

  • On-page SEO

    On-page SEO is optimising the content and HTML of each page, such as text, title tag, headings, images and internal links, to rank and earn clicks.

Back to the SEO glossary

Put the terms to work

Every term here is something OpenSEO measures. It is open source: start online in a minute, or run it on your own server.