WordPress Open Graph images: plugins, defaults, and code

WordPress can produce Open Graph tags from a plugin, a theme, or a few lines of code. The problem is that it often produces them from all three at once. The page renders, the preview looks fine in one place, and then a different platform picks the other image. The fix is almost always to choose one owner and remove the rest.

Option 1: let an SEO plugin own the tags

Yoast SEO, Rank Math, and All in One SEO all generate Open Graph tags. If one of them is active, it should be the only source. The exact labels move between versions, but the model is the same: a site-wide default image, a per-post override, and a social preview tab.

Set a default image that works for pages without a featured image, then use the featured image or the social tab for posts that need a specific card. A default is not a substitute for a per-post card; it is the fallback that prevents an empty preview on archive pages and older posts.

Option 2: add the tags in code

If you are building a custom theme and do not want a plugin, add the tags in functions.php or a small site-specific plugin. Use the featured image when it exists, then fall back to a default. Escape the URL and skip the output if no image exists.

<?php
add_action('wp_head', function () {
    if (!is_singular()) {
        return;
    }

    $post_id = get_queried_object_id();
    $image_id = get_post_thumbnail_id($post_id);
    $image = $image_id ? wp_get_attachment_image_url($image_id, 'full') : '';

    if (!$image) {
        $image = get_option('og_default_image');
    }

    if (!$image) {
        return;
    }

    $title = get_the_title($post_id);
    $description = get_the_excerpt($post_id);
    $url = get_permalink($post_id);

    echo '<meta property="og:title" content="' . esc_attr($title) . '" />' . "\n";
    echo '<meta property="og:description" content="' . esc_attr(wp_strip_all_tags($description)) . '" />' . "\n";
    echo '<meta property="og:type" content="article" />' . "\n";
    echo '<meta property="og:url" content="' . esc_url($url) . '" />' . "\n";
    echo '<meta property="og:image" content="' . esc_url($image) . '" />' . "\n";
    echo '<meta property="og:image:width" content="1200" />' . "\n";
    echo '<meta property="og:image:height" content="630" />' . "\n";
}, 5);

The dimensions above assume the uploaded file is actually 1200 x 630. If the featured image is a different size, either generate a 1200 x 630 crop with add_image_size('og', 1200, 630, true) and use that size, or read the real dimensions with wp_get_attachment_image_src and print those. Declaring 1200 x 630 for a 800 x 800 file is worse than omitting the tags.

add_image_size('og-card', 1200, 630, true);

// In the meta output:
$image_data = wp_get_attachment_image_src($image_id, 'og-card');
$image = $image_data ? $image_data[0] : '';
$width = $image_data ? $image_data[1] : 1200;
$height = $image_data ? $image_data[2] : 630;

Why WordPress sites get duplicate tags

A typical WordPress site has a theme, a child theme, an SEO plugin, and a social plugin. Any of them can call wp_head and print Open Graph tags. When two do, the page has two og:image values and the platform chooses one. The page source reveals it immediately.

curl -sL https://example.com/blog/post | grep -c 'property="og:image"'

If the count is greater than one, find the second source. Common culprits are a theme's functions.php, a "social share" plugin, and a page builder's SEO module. Remove one, then clear the page cache and re-scrape the URL.

Set a default image that is not a disaster

The fallback image appears on pages that have no featured image: archives, the home page, author pages, and older posts. Make it a proper 1200 x 630 card with the site name, a short value line, and the brand mark. Do not use the site logo on a transparent background; it will composite unpredictably.

• 1200 x 630, 1.91:1, with the text inside the safe area.
• A solid background, not a transparent PNG.
• The site name and the category or value line.
• A file under 1 MB, ideally under 300 KB.
• A filename that changes when the design changes, so caches refresh.

Cache layers to clear

WordPress adds several caches between your edit and the social crawler. If the tags are correct in the page source but the preview is stale, clear them in this order:

1. 01The page cache (WP Rocket, LiteSpeed Cache, W3 Total Cache, or your host's cache).
2. 02The CDN cache (Cloudflare, Fastly, or the host's edge).
3. 03The SEO plugin's social cache, if it has one.
4. 04The platform's own preview cache, via the Facebook Sharing Debugger or LinkedIn Post Inspector.

If the image itself changed, the platform may still hold the old file even after the page cache is clear. Change the image filename or append a version query string, then update the social image setting.

A quick WordPress checklist

• One SEO plugin owns the Open Graph output; no theme or hand-written duplicates.
• A default 1200 x 630 social image is set.
• Important posts have a specific social image, not just the featured image.
• The image URL is absolute and publicly reachable.
• The tags are in the initial HTML, not added by a client-side page builder.
• The post's canonical URL matches og:url.
• The page cache and CDN are cleared after a change.
• The live URL has been checked in the Facebook and LinkedIn debuggers.