Twitter cards on X: tags and testing

The tags

Because of the fallbacks, a site with good Open Graph tags needs only one extra line: <meta name="twitter:card" content="summary_large_image">. Without it, X shows the small summary card or none at all.

Card types

Twitter card worked example

The post is invented. A site already prints a complete Open Graph set, described in adding Open Graph tags in WordPress, and wants a wide card on X with alt text and the site's handle. The minimum addition is the first line below; the full set is what an SEO plugin typically prints when its social settings are filled in. Note that twitter tags use name where Open Graph tags use property, as the cited markup reference shows.

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@exampletown">
<meta name="twitter:title" content="Why the town clock runs slow">
<meta name="twitter:description" content="A 140 year old escapement, a hot summer, and a repair that took three attempts.">
<meta name="twitter:image" content="https://example.com/wp-content/uploads/2026/09/town-clock-1200x630.jpg">
<meta name="twitter:image:alt" content="The town clock face with the minute hand at ten past">

With the Open Graph set present, lines two to six repeat information X would have found anyway. They earn their place in two cases: when you want a different image or shorter title on X than on Facebook, and when you want the alt text, which has no Open Graph fallback in the cited markup reference. In our example the 1200 by 630 image is cropped toward 2:1 on the card, so the clock face sits in the centre and loses about 15 pixels top and bottom.

Image sizing

The large image card crops toward 2:1. A 1200 by 630 Open Graph image works well if the important content sits in the centre; see the safe zone in Open Graph image size. Keep the file under 5 MB and use JPG, PNG or WEBP. Animated GIFs show only the first frame.

Testing

1. 01

   View source

   Confirm one twitter:card tag and a single og:image.

2. 02

   Check the image loads publicly

   Open it in a private window over https.

3. 03

   Post a test

   X's standalone card validator no longer previews cards, so draft a post with the link, or share it from a test account, and look at the preview in the composer.

4. 04

   Re-share after changes

   X caches cards for a while; new posts pick up changes sooner than old ones.

Symptoms, causes and fixes

In WordPress

SEO plugins usually output twitter tags alongside Open Graph and let you choose the default card type. If your share plugin also prints them, you may get two twitter:card tags; keep one source. The old product images on this domain showed Open Graph and twitter card settings side by side, a reminder that the two have always been configured together.

What goes wrong

• Two twitter:card tags with different values. One plugin prints summary, another summary_large_image. Which wins depends on order; remove one.
• Using property instead of name. <meta property="twitter:card"> is a common copy-paste error. Some parsers accept it; the cited reference specifies name.
• An image over 5 MB. A full-size PNG export from a design tool often exceeds the limit and the card falls back to text. Export a JPG or WEBP at 1200 by 630.
• Alt text left empty. twitter:image:alt is the only place a preview image gets a description for screen readers. Fill it.
• A generated preview image with no disclosure. If the card image came from an image generator, the card itself carries no label; the options for saying so in the tags and the caption are in disclosing a generated preview image.
• Assuming the validator still works. The standalone validator stopped previewing cards; the composer preview and the Facebook debugger's tag list, described in Facebook showing the wrong image or share text, are the working tools.

Check it worked

• View source shows one twitter:card tag, using the name attribute, set to summary_large_image.
• twitter:image, if present, is an absolute https URL to a file under 5 MB; otherwise og:image is.
• twitter:image:alt carries a sentence that describes the picture.
• A draft post in the X composer shows a wide image card with the intended title.
• A test post from a second account shows the same card, which proves the image is public.

More on this topic sits in the Open Graph and link preview guides: start with adding Open Graph tags in WordPress, then Facebook showing the wrong image or share text.

Sources

• X Developer Platform, About X Cards (Internet Archive copy, May 2025)
• X Developer Platform, Cards markup reference (Internet Archive copy, May 2025)
• The Open Graph protocol

Questions

Related reading

1. 01Adding Open Graph tags in WordPressAdd Open Graph tags to WordPress with an SEO plugin or theme code: the four required tags, image tags, per-post overrides, and how to avoid duplicate tags.7 min read
2. 02Open Graph image size: 1200 by 630 and the safe zoneThe right Open Graph image size is 1200 by 630 pixels at a 1.91:1 ratio. Minimums, file limits, formats, and a centre safe zone for square crops.6 min read
3. 03Click to tweet boxes: how to build them in WordPressBuild a click to tweet box in WordPress with a block or a simple link. Wording, the 280 character limit, how links are counted, and how to style the quote.5 min read
4. 04Authorship tags for shared links: author, article:author and fediverse:creatorAdd authorship signals to link previews: the author meta tag, article:author, twitter:creator and fediverse:creator, with WordPress code and testing steps.6 min read