Add Open Graph Images in WordPress
The complete 2026 guide — with plugins, without plugins, and how to fix broken social previews on your WordPress site.
WordPress powers over 40% of the web. If your WordPress site doesn't output a proper og:image tag, every link shared from your site looks plain and unprofessional. The good news: adding og:image support takes under 5 minutes, whether you use a plugin or not.
Method 1: Using Yoast SEO (easiest)
Yoast SEO is the most popular WordPress SEO plugin (5+ million active installs). It automatically generates og:image tags from your featured image. Here's how to set it up:
- 1Install and activate Yoast SEO (Plugins → Add New → search "Yoast SEO")
- 2Edit any post and set a Featured Image (right sidebar → Post → Featured image)
- 3Scroll to the Yoast SEO panel below the content editor
- 4Click the Facebook tab (social settings) to optionally override the image
- 5Update the post. Yoast outputs the og:image tag automatically
Yoast uses your featured image by default. If you want a different image for social (often a good idea — social images benefit from larger text), upload a custom one in the Facebook tab.
Method 2: Using Rank Math
Rank Math is Yoast's main competitor and includes og:image support in its free version (Yoast requires premium for some social features).
- 1Install Rank Math (Plugins → Add New → search "Rank Math")
- 2Edit a post and set a Featured Image
- 3Click the Rank Math meta box → Social tab
- 4Upload or select your social image (1200x630 recommended)
- 5Update the post
Method 3: No plugin (functions.php)
Prefer to keep it lean? You can output og:image tags with a small function in your theme's functions.php:
// Add og:image from featured image
add_action('wp_head', function() {
if (!is_single() && !is_page()) return;
$post_id = get_the_ID();
if (!$post_id) return;
// Featured image
if (has_post_thumbnail($post_id)) {
$img = wp_get_attachment_image_src(
get_post_thumbnail_id($post_id),
'full'
);
if ($img) {
echo '<meta property="og:image" content="' .
esc_url($img[0]) . '" />' . "
";
echo '<meta property="og:image:width" content="' .
esc_attr($img[1]) . '" />' . "
";
echo '<meta property="og:image:height" content="' .
esc_attr($img[2]) . '" />' . "
";
}
}
// Title and description
echo '<meta property="og:title" content="' .
esc_attr(get_the_title()) . '" />' . "
";
echo '<meta property="og:description" content="' .
esc_attr(wp_trim_words(get_the_excerpt(), 30)) .
'" />' . "
";
echo '<meta property="og:url" content="' .
esc_url(get_permalink()) . '" />' . "
";
echo '<meta property="og:type" content="article" />' . "
";
});Add this to your child theme's functions.php so updates don't overwrite it. It reads the featured image and outputs all the open graph tags you need.
Setting the right featured image
Whether you use a plugin or manual code, your featured image is usually what becomes your og:image. Follow these rules:
Upload at 1200x630 or larger
WordPress uses the original file for og:image. Small images look pixelated.
Use PNG or JPG
WebP support varies across crawlers. Stick with PNG for text-heavy images, JPG for photos.
Keep it under 1MB
Social crawlers timeout on large files. Compress before uploading.
Troubleshooting: WordPress og:image not working
og:image tag is missing entirely
Check that your SEO plugin is active and the post has a featured image. View page source (Ctrl+U) and search for "og:image".
Image URL is wrong or relative
Some themes output relative URLs. Go to Settings → General and ensure both Site URL fields use https:// and your full domain.
Caching plugin serving old tags
If you use WP Rocket, W3 Total Cache, or similar, clear the cache after changing featured images. The cached HTML may still have the old og:image URL.
Social platform cache is stale
After updating your image, use the Facebook Sharing Debugger or Twitter Card Validator to force a re-scrape. Platforms cache for days.
Frequently asked questions
How do I add an og:image in WordPress without a plugin?
Add a function to your theme's functions.php file that outputs a meta tag with the featured image URL. Use wp_get_attachment_image_src() to get the image URL from the post thumbnail, then hook into wp_head to echo the og:image meta tag.
Does Yoast SEO automatically add og:image tags?
Yes. Yoast SEO automatically generates og:image tags from your post's featured image. Go to the Yoast panel in the post editor, click the social tab (Facebook icon), and you can override the default image with a custom one.
What size should my WordPress og:image be?
1200x630 pixels. This is the standard open graph size that works on Facebook, Twitter, LinkedIn, and Slack. Upload your featured image at this size, or larger, and WordPress will use it directly.
Why is my WordPress og:image not showing on Facebook?
The most common cause is that the og:image URL is relative or the image is too small. Facebook requires absolute URLs (starting with https://) and images at least 200x200px. Use the Facebook Sharing Debugger to diagnose, then click Scrape Again after fixing.