guides

Twitter / X Card Not Working? A Debugging Checklist for 2026

Your X (Twitter) card not working usually comes down to a missing twitter:card tag, a relative or blocked image, or a stale cache. Here is a step-by-step checklist to find the exact cause and fix it.

If your Twitter card is not working, the cause is almost always one of four things: a missing twitter:card meta tag, an og:image that is relative, blocked, or the wrong size, a cached old version of the page, or markup that lives behind JavaScript the crawler never runs. Work through the checklist below in order and you will find the culprit in a few minutes — no guesswork required.

X (formerly Twitter) reads a small set of <meta> tags from your page’s <head> when a link is shared, and falls back to your Open Graph tags for anything it can’t find. When the preview is blank, broken, or showing a tiny thumbnail instead of a full-width image, one of those tags is missing or unreachable.

Step 1: Confirm the twitter:card tag exists

This is the single most common reason a card silently fails. To get the big, clickable image card, your page needs exactly this line in the <head>:

<meta name="twitter:card" content="summary_large_image">

Without it, X may either show a cramped summary card with a small square thumbnail, or no image at all. Note the attribute is name, not property — X uses the name namespace for its tags, unlike Open Graph which uses property. A common mistake is copying the OG pattern and writing <meta property="twitter:card">, which some parsers ignore.

A complete, working set looks like this:

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="How we cut churn by 38% in one quarter">
<meta name="twitter:description" content="The three experiments that moved the needle.">
<meta name="twitter:image" content="https://example.com/og/churn.png">

If you only have Open Graph tags, that is usually fine — X reads og:title, og:description, and og:image as fallbacks. The one tag it will not infer is twitter:card itself, so add that line even if everything else comes from OG.

Step 2: Check the image — the usual saboteur

When the text shows but the picture doesn’t, the image tag is the problem. Run through these in order:

The URL must be absolute

X’s crawler does not resolve relative paths. content="/og/churn.png" will fail; it must be the full https://example.com/og/churn.png. This is the most frequent image failure of all.

The image must be publicly reachable

The crawler fetches the image directly. If it sits behind a login wall, a robots.txt Disallow, a firewall rule, hotlink protection, or a CDN that blocks unknown user agents, the fetch returns nothing and the card renders empty. Open the image URL in a private browser window with no cookies — if you can’t see it, neither can X.

The dimensions and file size must be in range

  • Aim for 1200×630 pixels (a 1.91:1 ratio) for a summary_large_image card. This is the same size Open Graph uses, so one image serves both.
  • Minimum 300×157 for the large card; below that X downgrades to the small thumbnail layout.
  • Keep the file under 5 MB. Larger files are rejected. A clean PNG or JPEG well under 1 MB is ideal.
  • Use a supported format: JPG, PNG, WEBP, or GIF. SVG is not supported, and the first frame is used for animated GIFs.

A square logo or a tall hero photo will be cropped or shrunk into a small card. If you’re not sure of your image’s real dimensions, you can paste the page URL into Ogwave’s free preview tool — it fetches your tags, measures the actual image, and flags exactly which ones are wrong.

Step 3: Bust the cache

X caches card data aggressively. If you fixed your tags but the old (broken) card still shows, you are looking at a cached copy. The fix is to force a re-scrape.

Historically the Twitter Card Validator did this, but it was retired. In 2026 the reliable way to refresh is to change the URL the crawler sees — append a harmless query string such as ?v=2 when you paste the link to confirm the new card renders, then share the canonical URL once you’ve verified it. Editing a Tweet or composing a fresh one also re-triggers the fetch. Give the cache a few minutes to clear before judging the result.

If the card works with ?v=2 appended but not on the bare URL, your tags are correct — you’re just waiting on the cache to expire.

Step 4: Make sure the tags aren’t hidden behind JavaScript

The crawler reads the raw HTML response. It does not execute your JavaScript. If a single-page app or a client-side framework injects the meta tags after load, the crawler sees an empty <head> and the card fails.

To check, fetch the raw HTML the way a bot would and look for your tags in the response:

curl -A "Twitterbot/1.0" -s https://example.com/your-page | grep -i "twitter:card\|og:image"

If your tags don’t appear in that output, they aren’t in the server-rendered HTML. The fix is server-side rendering, static pre-rendering, or generating the meta block at build time so the tags are present before any JavaScript runs.

Step 5: Validate the surrounding markup

A few smaller issues can break an otherwise-correct card:

  1. Tags outside the <head>. Meta tags placed in the <body> are ignored. Keep them in <head>.
  2. Duplicate or conflicting tags. Two different twitter:image values, or an og:image that contradicts twitter:image, can produce unpredictable results. Declare each once.
  3. A redirect on the page URL. If the shared URL 301s elsewhere, make sure the destination also carries the tags, and set og:url / a canonical link to the final address.
  4. Special characters not escaped. An unescaped quote inside a content attribute truncates the value. Escape &, ", and <.

A quick triage table

Match the symptom to the likely cause:

  • No card at all → missing twitter:card tag, or tags behind JavaScript (Steps 1 & 4).
  • Text shows, image missing → relative, blocked, or oversized image (Step 2).
  • Small thumbnail instead of big imagetwitter:card set to summary instead of summary_large_image, or image under the size minimum.
  • Old card keeps showing after a fix → cache; force a re-scrape (Step 3).

Stop fixing cards one page at a time

Most card problems are really a process problem: tags get added by hand, so they drift, go missing on new pages, or point at images that were never made at the right size. The durable fix is to generate the image and the meta block automatically for every page.

That is what Ogwave is built for. Point it at your sitemap.xml and it renders an on-brand 1200×630 card for every URL, then hands you a copy-paste meta block with twitter:card=summary_large_image, absolute image URLs, and the width and height already filled in — the exact things this checklist tells you to verify. You can pick a layout from the template gallery and have consistent, working cards across your whole site instead of debugging them one at a time. Start with the free preview tool to see precisely what X sees today.

All articles