How to add Open Graph & Twitter Card tags without a plugin

Add Open Graph and Twitter Card tags without a plugin: the exact WordPress code, the static HTML version, and how to verify it actually worked.

Hosting & Dev

By ANUPRESS Team · Last reviewed August 2026 · 8 min read

You can add Open Graph and Twitter Card tags without a plugin by pasting five lines into your theme’s header, or, on WordPress, hooking one small function into wp_head so every post fills them in automatically. Neither approach needs Yoast, Rank Math, or any other full SEO plugin if the tags are the only reason you were considering installing one.

This matters more than it sounds like it should, since a full SEO plugin is genuinely heavy machinery to install for five meta tags: extra database tables, an admin settings screen, sometimes its own caching layer, all to control something you can hard-code correctly once and never think about again.

Open Graph and Twitter Card tags added without a plugin illustration showing raw HTML head code
Five lines of code, zero plugins, one working share preview

The minimum tag set that actually matters

Five properties cover essentially every platform: Facebook, LinkedIn and Slack read the Open Graph ones directly, and X falls back to the same Open Graph tags for anything the Twitter Card tags don’t explicitly override.

Paste into <head>, one page at a time
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="One or two honest sentences" />
<meta property="og:image" content="https://example.com/share-1200x630.jpg" />
<meta property="og:url" content="https://example.com/this-exact-page/" />
<meta name="twitter:card" content="summary_large_image" />

The og:image should be 1200×630 pixels, a 1.91:1 ratio that Facebook, LinkedIn and X all crop to without adding bars or cutting off content, and the URL has to be absolute (starting with https://), never a relative path, because the platform scraping your page has no idea what domain “/images/share.jpg” is supposed to belong to.

Static HTML: five lines, done

On a plain HTML site, or any single landing page, paste the five tags directly into the <head> with real values for that specific page and you’re finished. No build step, no dependency, nothing to update when a plugin releases a new version. The only ongoing cost is remembering to update the tags if the page’s title or image genuinely changes later, which for a static page is rare enough to not be a real burden.

WordPress without a plugin

A WordPress site needs the tags to change per post automatically, since hard-coding one static set in header.php would give every single page on the site an identical share preview. The fix is a small function hooked into wp_head, added through your theme’s functions.php or, better, a small site-specific plugin so it survives a theme update.

functions.php — pulls title, excerpt and featured image automatically
function anu_output_og_tags() {
    if ( ! is_singular() ) {
        return;
    }

    $title = get_the_title();
    $desc  = has_excerpt() ? get_the_excerpt() : wp_trim_words( get_the_content(), 30 );
    $url   = get_permalink();
    $image = has_post_thumbnail()
        ? get_the_post_thumbnail_url( get_the_ID(), 'large' )
        : 'https://example.com/default-share-image.jpg';

    echo '<meta property="og:title" content="' . esc_attr( $title ) . '" />' . "\n";
    echo '<meta property="og:description" content="' . esc_attr( $desc ) . '" />' . "\n";
    echo '<meta property="og:image" content="' . esc_url( $image ) . '" />' . "\n";
    echo '<meta property="og:url" content="' . esc_url( $url ) . '" />' . "\n";
    echo '<meta name="twitter:card" content="summary_large_image" />' . "\n";
}
add_action( 'wp_head', 'anu_output_og_tags' );

Two WordPress functions do the real work: has_excerpt() falls back to a trimmed version of the post body when no manual excerpt exists, so the description is never blank, and has_post_thumbnail() falls back to one fixed default image, so a post published without a featured image still gets a real preview instead of nothing. The esc_attr() and esc_url() calls aren’t optional extras, they prevent a post title containing a stray quotation mark from breaking the HTML output entirely.

Before you paste this in

  • If an SEO plugin is already active and already outputs Open Graph tags, adding this too creates duplicates, most platforms just use whichever appears first, but it’s worth checking your page source for existing og: tags before adding more
  • Put this in a small site-specific plugin rather than your theme’s functions.php if you ever plan to change themes, functions.php doesn’t survive a theme switch
  • Swap the default image URL for a real one on your own site before this goes live

Or skip the code entirely

If you only need this for a handful of pages, or you’d rather see the exact tags before you commit to code, fill in a few fields and get the full block generated with a live preview.

Open the meta tag generator

Verifying it actually worked

Don’t just trust the HTML source, platforms cache what they scrape. Facebook and LinkedIn both offer official debugging tools that show exactly what they see and let you force a fresh re-scrape: Facebook’s Sharing Debugger and LinkedIn’s Post Inspector. Paste your URL in, and if the preview looks wrong, the “scrape again” button is what actually clears their cached version, editing your tags alone does not retroactively fix a link that’s already been shared once.

The mistakes that actually break previews

MistakeWhat happens
Relative image URLBlank preview; the scraper can’t resolve a path without a domain
Image blocked by robots.txtScrapers respect robots.txt too; a blocked image folder means no preview image anywhere
Multiple conflicting og:title tagsA plugin and manual code both outputting tags; the platform picks one unpredictably
Editing tags after a link’s been shared onceOld preview persists until you force a re-scrape through the platform’s own debug tool

Frequently asked questions

Do I need separate Twitter Card tags, or does Open Graph cover it?

Open Graph covers most of it. The one Twitter-specific tag worth adding is twitter:card set to summary_large_image, X falls back to your og:title, og:description and og:image for everything else.

Why does my preview still show the old image after I changed it?

The platform cached the page the first time it was shared. Use Facebook’s Sharing Debugger or LinkedIn’s Post Inspector and force a re-scrape; simply changing the tag on your own site doesn’t clear a cache you don’t control.

Can I add these tags without touching PHP at all?

Yes, on a static HTML page you paste the five lines directly with no code logic involved. On WordPress specifically, you need either the small function shown above or a plugin, since the tags have to change per post.

What size should the og:image actually be?

1200×630 pixels is the safe standard, a 1.91:1 ratio every major platform crops to cleanly. Going smaller risks a blurry or oddly-cropped preview on some platforms.

Will adding these tags manually hurt my SEO plugin’s functionality?

Not if you check for duplicates first. If your SEO plugin already outputs Open Graph tags, adding this function too just creates redundant tags rather than breaking anything, but it’s cleaner to pick one source and disable the other.

For the rest of your site’s technical setup, from redirects to cron jobs, see the complete developer tools guide. Last reviewed August 2026. See how we review and our affiliate disclosure.

ANUPRESS Team
ANUPRESS Team

ANUPRESS Team writes and builds everything on this site — reviews and 48+ free browser-based tools alike. We test what we review by actually using it, not by summarizing a spec sheet. Spot something wrong or want to know more about a specific piece? Reach us through the contact page.

Articles: 31