Do you use title tags and meta description tags? Of course you do—because strong titles influence rankings and meta descriptions influence click-throughs. But great on-page SEO doesn’t stop there.

Those same pages also need social meta tags. Beyond Google, platforms like Facebook and X (formerly Twitter) read “open graph” style tags to decide how your links look when shared. Use them well and you’ll earn larger previews, better images, and more social clicks.

Ever see posts in your feed with big, crisp images, clean titles, and descriptions? You don’t need special software or paid tools to get that look. You just need the right meta tags.

They’re called Facebook Open Graph and Twitter (X) Cards. Here’s how to leverage both:

Facebook Open Graph

When you share a page on Facebook, what does it look like?

Facebook’s crawler tries to read your page, but it won’t reliably pick the best image, title, or description unless you provide Open Graph tags. Without them, your shares can look bare or generic:

Before we implemented Open Graph on Quick Sprout, our Facebook shares often showed no image or the wrong one. After adding the right tags, link previews consistently displayed strong visuals and we saw a significant lift in social traffic.

Here’s how to set up Open Graph correctly.

og:title

Use the human-friendly title you want shown on Facebook. Think of this like your HTML title, but optimized for people in the feed. Aim for clear, scannable phrasing (roughly 60–90 characters) to avoid truncation.

Example: <meta property=”og:title” content=”11 Creative Ways to Build Links” />

og:type

Describe the content type so Facebook can choose the right presentation. For most blog content, use article. Other common types include website, video.movie, and product. Full taxonomy options include the following:

Activities

  • activity
  • sport

Businesses

  • bar
  • company
  • cafe
  • hotel
  • restaurant

Groups

  • cause
  • sports_league
  • sports_team

Organizations

  • band
  • government
  • non_profit
  • school
  • university

People

  • actor
  • athlete
  • author
  • director
  • musician
  • politician
  • public_figure

Places

  • city
  • country
  • landmark
  • state_province

Products and Entertainment

  • album
  • book
  • drink
  • food
  • game
  • product
  • song
  • movie
  • tv_show

Websites

  • blog
  • website
  • article

Example: <meta property=”og:type” content=”article” />

og:description

Write a compelling, human-first summary that entices a click. Don’t stuff keywords—focus on clarity and benefit. Keep it short (1–2 sentences) so it won’t be truncated in most feeds.

Example: <meta property=”og:description” content=”Tired of old-school link building? Here are modern, creative ways to earn high-quality links without blasting cold emails.” />

og:image

Always supply a share image so your post stands out. Use a large, high-resolution image (commonly 1200×630 px, 1.91:1 aspect ratio). Host it over HTTPS, keep filesize reasonable for fast fetching, and provide alt text for accessibility.

Examples:
<meta property=”og:image” content=”https://www.quicksprout.com/wp-content/uploads/2013/03/linkbuilding.jpg” />
<meta property=”og:image:width” content=”1200″ />
<meta property=”og:image:height” content=”630″ />
<meta property=”og:image:alt” content=”Creative link building ideas illustrated” />

og:url

Set this to the canonical URL of the page. This helps consolidate engagement signals to a single address if your content is available at multiple URLs.

Example: <meta property=”og:url” content=”https://www.quicksprout.com/2013/03/21/11-creative-ways-to-build-links/” />

og:site_name

Communicates your brand name. Optional but harmless and often useful.

Example: <meta property=”og:site_name” content=”Quick Sprout” />

fb:app_id / fb:admins

If you want deeper Insights data, connect your site to a Facebook app or admin. Using fb:app_id is the modern approach; fb:admins can still work in some setups.

Examples:
<meta property=”fb:app_id” content=”1234567890″ />
<meta property=”fb:admins” content=”500013011″ />

Now that your Open Graph tags are set, let’s add Twitter (X) Cards.

Twitter Cards

Rich previews appear when your page includes Twitter (X) Card tags. They help your links stand out and earn more clicks directly from the timeline.

Here’s how to set them up:

If you use the SEO for WordPress plugin by Yoast, just follow these steps. Rank Math and AIOSEO offer similar toggles to enable Twitter (X) Cards automatically. For manual markup, use the tags below.

twitter:card

Choose the card layout. Use summary_large_image for most blog posts (big image), summary for a compact layout, and player for video/audio embeds.

Example: <meta name=”twitter:card” content=”summary_large_image” />

twitter:url

Specify the canonical URL so shares consolidate to one address instead of fragmenting across parameters or duplicates.

Example: <meta name=”twitter:url” content=”https://www.quicksprout.com/2013/03/21/11-creative-ways-to-build-links/” />

twitter:title

Keep it punchy and human. Avoid keyword stuffing. Staying under ~70 characters helps prevent truncation in most clients.

Example: <meta name=”twitter:title” content=”11 Creative Ways to Build Links” />

twitter:description

Summarize the benefit in one or two sentences. Focus on clarity and curiosity, not keywords. Aim for ~200 characters or less to avoid cutoffs.

Example: <meta name=”twitter:description” content=”Tired of old-school link building? Try these creative tactics to earn quality links without mass outreach.” />

twitter:image

Provide a large image so your preview pops. A common choice is 1200×628 px (similar to Open Graph). Use fast-loading, high-quality JPG or PNG files hosted over HTTPS.

Example: <meta name=”twitter:image” content=”https://www.quicksprout.com/wp-content/uploads/2013/03/linkbuilding.jpg” />

Optional but Useful

Add your handle and a creator handle to enhance brand visibility in-card.

Examples:
<meta name=”twitter:site” content=”@YourBrand” />
<meta name=”twitter:creator” content=”@AuthorHandle” />

Testing & Troubleshooting

After you add tags, platforms fetch your page the first time someone shares it. If previews don’t look right, try these fixes:

  • Use Facebook’s Sharing Debugger to scrape your URL and refresh the cache if the wrong image or title appears.
  • Use X’s Card Validator to preview how your card will render and identify missing tags.
  • Ensure your page is publicly accessible (no logins required) and not blocked by robots.txt or noindex headers.
  • Serve images over HTTPS with correct Content-Type headers, and include og:image:width/og:image:height for faster, more reliable rendering.
  • Clear your CDN and WordPress caching plugin after changing tags or images so crawlers see the latest version.

WordPress Setup (Fast Path)

On WordPress, the easiest route is to let your SEO plugin output these tags for you:

  • Yoast SEO: Enable Open Graph and Twitter (X) Cards, set your default social images, and customize per post in the editor.
  • Rank Math / AIOSEO: Similar toggles with per-post overrides and sitewide fallbacks.
  • Theme builders: Some themes add partial support—prefer the SEO plugin’s controls to keep things consistent.

Still, always preview your most important posts with the platform debuggers to confirm the exact image, title, and description that will appear.

Conclusion

Meta tags aren’t just for search engines. Social platforms rely on them to build rich link previews that influence whether people click. Just as you optimize titles and descriptions for Google, optimize Open Graph and Twitter (X) tags so your content looks its best wherever it’s shared.

It’s a small setup that pays off with cleaner previews, stronger branding, and more visits from social media—on every share.