Skip to main content
SlapMyWeb
Slap a site

SEO fix

How to Add Twitter Card Tags

Control how the page looks when it is shared on X and in chat apps.

Difficulty
Easy
Impact
Low
Time
15 min

Before

<!-- no twitter: tags; X renders a bare link -->

After

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="How to fix redirect chains">
<meta name="twitter:description" content="Collapse multi-hop redirects into one.">
<meta name="twitter:image" content="https://example.com/og.png">
Before and after code for: How to Add Twitter Card Tags

Missing Twitter Card tags mean X and several chat apps have to guess how to render your link, which usually produces a bare URL instead of a card. Adding twitter:card, twitter:title, twitter:description and twitter:image gives a large image preview. Most platforms fall back to Open Graph, so the two are normally added together.

Why it matters

A shared link with a large image preview gets substantially more attention than a plain URL. These tags have no ranking effect at all: the entire value is in whether people click a shared link.

How to fix it

  1. Add the card type

    summary_large_image is right for almost everything. summary gives a small thumbnail.

  2. Add the title, description and image

    The image must be an absolute URL. Around 1200 by 630 pixels works across platforms.

  3. Let Open Graph do the fallback

    X falls back to og:title, og:description and og:image, so you only need twitter-specific tags where they should differ.

  4. Test a real URL

    Use a card validator, and remember platforms cache aggressively: a fix may need the cache cleared before it shows.

The code

Beforehtml
<!-- no twitter: tags; X renders a bare link -->
Afterhtml
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="How to fix redirect chains">
<meta name="twitter:description" content="Collapse multi-hop redirects into one.">
<meta name="twitter:image" content="https://example.com/og.png">

On your platform

WordPress

SEO plugins output these from the post's social settings. Set a default image so posts without one still render a card.

Next.js

The twitter key in the metadata export generates these; it inherits from openGraph where you do not override it.

Sources

More fixes

SEO

How to Remove an Accidental noindex

Find and remove a stray noindex that is keeping an important page out of Google entirely.

SEO

How to Fix Broken Internal Links (404s)

Find and repair internal links that point to missing pages so you stop leaking link equity.

SEO

How to Fix Redirect Chains

Collapse multi-hop redirects (A→B→C) into a single hop to the final URL.

Fixed that one.
Now find the rest.

A free audit ranks every issue on your site by the score points it costs, and links each one straight to its guide.

Run a free audit
Free foreverNo signupLive scan progress