Skip to main content
← πŸ“„ HTML & the platformΒ·Module A6 Β· Lesson 6
TaskAdd Twitter card tags to a post: twitter:card 'summary_large_image', twitter:site '@codementor', twitter:image 'https://example.com/og.png', twitter:image:alt 'Article hero image'.

X / Twitter cards

75 XP6 min
Theory

X (formerly Twitter) reads OG too β€” but adds its own tags

The site rebranded to "X" in 2023 but every meta tag still uses the literal string twitter:*. The card preview hasn't changed; only the company name did.

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@codementor_ai" />
<meta name="twitter:creator" content="@anna_dev" />
<meta name="twitter:image" content="https://example.com/og.png" />
<meta name="twitter:image:alt" content="A product logo" />

twitter:card β€” the only one that ALWAYS matters

summary              β†’ small thumbnail beside text
summary_large_image  β†’ big image on top, text below
player               β†’ video / audio player
app                  β†’ install card with App Store badge

summary_large_image is what you almost always want β€” visually it's the biggest, most engaging unfurl. Without this tag explicitly set, Twitter falls back to summary (small thumbnail).

twitter:site vs twitter:creator

  • twitter:site β€” your brand's handle (@codementor_ai).
  • twitter:creator β€” the article author's handle (@anna_dev).

Both optional. twitter:site is the more important one β€” it links your brand into the share card.

When you can skip Twitter tags entirely

If you have a full set of OG tags + twitter:card="summary_large_image", Twitter renders perfectly. Some teams ship just that one Twitter tag and let everything else fall through to OG.

The image rule

Twitter wants a 2:1 aspect ratio (1200 Γ— 600 or 1600 Γ— 800) for summary_large_image. The 1200Γ—630 OG image works fine β€” Twitter crops the top/bottom 15px (you won't notice).

πŸ”’

Sign up to start coding

Theory is open to everyone. The interactive editor, live preview, and check are unlocked with a 7-day free trial β€” card required, cancel anytime.

Sign up β€” free trial β†’

First 10 lessons in each track are free. No card needed for those.

← PreviousNext lesson β†’

Get one Python or web tip a day β€” by email

Short, hand-written, no spam. Unsubscribe in one click.