WordPress
Add X (Twitter) Cards to WordPress
Set up X (Twitter) Cards in WordPress with Yoast SEO, Rank Math or a few lines of PHP, choose large image cards, and fix the usual caching problems.
Short answer
In WordPress the easiest route is an SEO plugin: in Yoast SEO turn on X card data under Settings > Site features, in Rank Math set the Twitter Card Type under Titles & Meta; both use your featured image and SEO title unless you set X-specific values per post.
Key takeaways
- Use one SEO plugin for social tags, never two, and do not hand-code tags on top of it.
- Set a default social image so pages without a featured image still get a card.
- Featured images of at least 1200 pixels wide give clean large image cards.
- Page caching plugins can serve stale tags; purge after changing them.
WordPress does not print social meta tags on its own. Some themes do, most SEO plugins do, and it is surprisingly common for a site to have two of them doing it at once. Pick one source, configure it once, and the cards take care of themselves.
What is the quickest way to add X Cards in WordPress?
Use the SEO plugin you already have; Yoast SEO and Rank Math both output X Card tags. If you have neither, install one or use the code at the end of this guide. Do not stack a dedicated card plugin on top of an SEO plugin.
Setting up Yoast SEO
Yoast turns X card data on by default; check the switch, connect your profile and set per-post values where you need them.
- Go to Yoast SEO > Settings > Site features. Under Social sharing, make sure X card data is enabled, and save.
- Go to Yoast SEO > Settings > Site representation and add your X profile. For an organization it goes under other profiles; for a person, it goes on the user's profile.
- Edit a post. In the Yoast sidebar or meta box, open Social media appearance and the X section to set a title, description and image just for X.
Leave the X fields empty and Yoast fills the card from the SEO title, meta description and featured image. That is the right behavior most of the time; set X fields only when you want different wording or a 2:1 crop.
Setting up Rank Math
Rank Math has a global card type setting and a Twitter tab on every post.
- Go to Rank Math SEO > Titles & Meta > Global Meta. Upload an OpenGraph Thumbnail (Rank Math recommends 1200x630) to act as the default image, set Twitter Card Type to Summary Card with Large Image, and save.
- For the homepage, if it shows your latest posts, fill in the Facebook title, description and thumbnail under Titles & Meta > Homepage; they apply to X as well.
- In a post, open the Rank Math meta box, choose the Social tab, then Twitter. Turn off Use Data from Facebook Tab to enter X-specific values, and set the card type for that post if it differs.
If you skip the custom image, Rank Math uses the featured image, then the global default.
Images that work well
Set featured images to at least 1200 pixels wide and keep the subject near the center. Both plugins pass the featured image through as og:image, and X shows large image cards at 2:1, cropping from the center. A 1200x630 featured image works; a 1200x600 one fits X exactly. Very tall portrait images make poor large image cards, so choose a different featured image or set a dedicated social image for that post.
| Setting | Recommendation |
|---|---|
| Default social image | 1200x630, your brand on a plain background |
| Featured images | 1200 pixels wide or more, landscape |
| Format | JPG for photos, PNG for graphics, WEBP if your stack serves it |
| File size | Well under 5 MB; aim for a few hundred KB |
| Alt text | Fill in the image's alt text in the Media Library |
The image checker can crop a photo to exactly 2:1 before you upload it.
Using code instead of a plugin
Hook into wp_head from a child theme or a small site plugin and print the tags for single posts and pages. A minimal version:
add_action( 'wp_head', function () {
if ( ! is_singular() ) { return; }
$img = get_the_post_thumbnail_url( null, 'full' );
echo '<meta name="twitter:card" content="summary_large_image">' . "\n";
echo '<meta property="og:title" content="' . esc_attr( get_the_title() ) . '">' . "\n";
echo '<meta property="og:description" content="' . esc_attr( get_the_excerpt() ) . '">' . "\n";
echo '<meta property="og:url" content="' . esc_url( get_permalink() ) . '">' . "\n";
if ( $img ) {
echo '<meta property="og:image" content="' . esc_url( $img ) . '">' . "\n";
}
} );
esc_attr and esc_url keep quotes and odd characters in titles from breaking the markup. The snippets tool produces this block with your own X handle filled in. Remove it if you later install an SEO plugin.
Why does WordPress keep showing the old card?
Usually a page cache, then X's own cache. Caching plugins and hosting caches store the full HTML, tags included. After changing social settings:
- Purge the page cache for the post (or the whole site after a global change).
- View source in a private window and confirm the new tags.
- If you replaced an image in the Media Library under the same file name, upload it as a new file instead, so its URL changes.
- Test in the X composer with
?v=2on the end of the URL.
Check for duplicate tags
Open View Source on a post and search for twitter:card. You want exactly one. Two usually means a theme and a plugin are both printing tags, or two plugins are. Turn off the social output in whichever one you are not using. Paste the head into the inspector; it lists repeated tags with different values, which is where the wrong image normally comes from.
Questions
Do I need a plugin just for X Cards?
No. Yoast SEO and Rank Math include card output. If you do not want an SEO plugin, a short wp_head function in a child theme can print the tags.
Why does my card show the wrong image?
The plugin falls back from the X image to the Facebook image to the featured image to a site default. Check which of those is set for the post, then clear your page cache and test with a new query string.
Does Jetpack add card tags?
Jetpack can output Open Graph and Twitter tags when its sharing features are on. If you also run Yoast or Rank Math, check the page source for duplicates and keep only one source.
Is there an old TwitterCard WordPress plugin I should install?
No. This site does not distribute a plugin. Current SEO plugins handle cards well, and the code snippet below covers themes without one.