Skip to content 
wordpress open graph controls how your posts appear as a preview on Facebook, X, LinkedIn or Pinterest. I'll show you how to set the right open graph tags, check them without errors and thus achieve more clicks, dwell time and interactions.
Key points
- OG tags Determine the title, description and image of your preview
- og:image provides the decisive preview image for clicks
- Plugins like RankMath or OG take a lot of work off your hands
- Testing with debuggers prevents incorrect snippets
- Performance and hosting influence loading time and image quality
What are Open Graph tags and why do they help with sharing?
Open Graph-Tags are meta information in the head of your page that networks read for the link preview. I specify which title, which short description, which image and which content type is displayed. This gives the preview a uniform and comprehensible look instead of a random mix. The image tag og:image in particular often determines attention and clicks. Properly maintained OG tags increase the professionalism of your snippets and pay off in terms of engagement.
The most important OG tags for WordPress
Core days are og:title, og:description, og:url, og:site_name, og:type and og:image. With og:type, I mark the content as an article, product, video or page, which improves the display. og:url shows the canonical address so that shares are not scattered across variants. og:site_name anchors your brand in every preview. With carefully chosen values, you deliver a clear benefit teaser instead of random text snippets.
Set up Open Graph in WordPress with plugins
Plugins such as RankMath, Yoast SEO or OG - Better Share on Social Media set the most important tags automatically. In the social settings, I store a separate preview for each post, including an individual title, short description and image. The OG plugin adds OG tags and Twitter cards without configuration and also reliably recognizes products and pages. I save a lot of time for stores and multilingual websites because fields and templates are already available. In my Social media strategy 2025 a consistent snippet design plays a central role.
Manual integration: full control in the theme
Code-Friends enter the tags via wp_head, for example in functions.php or via a snippet plugin. I query dynamic values and ensure a clean fallback image if a post does not have one. The unique canonical URL remains important so that every preview points to the correct address. After changes, I delete caches and check the result in the debugger. This keeps the output lean and avoids duplicate tags from multiple sources.
<meta property="og:title" content="" />
<meta property="og:description" content="" />
<meta property="og:url" content="" />
<meta property="og:site_name" content="" />
<meta property="og:image" content="" />
Choose the right image for og:image
pictures are the strongest lever for clicks on social platforms. I use a 1200×630 pixel format as a starting point because it scales well on many platforms. I compress the file with minimal loss and add meaningful ALT text to provide context. I keep text in the image concise and easy to read so that nothing looks cut off on mobile feeds. A consistent style strengthens the recognizability of your brand.
Check and reload previews
Testing is part of every publishing process. I use the platforms' debug tools to manually reload the preview if there is still old data in the cache. This allows you to see immediately whether the title, description and image are working correctly. Technical problems such as duplicate tags or incorrect URLs will also be noticed early on. For overall performance and indexing, a clean tracking setup helps, which I explain in the article Search Console Setup complete.
Special cases: Products, events and videos
Product snippets benefit from additional meta fields such as price, availability or brand. For events, the date, location and organizer help to ensure that the preview conveys the benefits at first glance. For videos, I add duration, preview image and video URL so that feeds create an attractive tile. Many SEO plugins offer suitable fields or recognize content automatically, which significantly speeds up the workflow. I always check the output for consistency with the OG basic tags.
Performance, caching and image CDN
Performance can be felt in every preview, which loads quickly and looks clear. I reduce the image size, use modern formats such as WebP and deliver the graphics with a CDN. In caching plugins, I exclude preview pages if they hold incorrect versions and clear the cache after image changes. I avoid duplicate OG tags from several plugins by leaving only one solution active. This keeps delivery and display reliable.
Hosting tip: Fast servers for strong social snippets
Hosting determines how quickly images, HTML and metadata are displayed. For OG-optimized projects, I look at the PHP version, HTTP/2 or HTTP/3, object cache and image processing. Good providers deliver clean Varnish or Nginx configurations that do not interfere with WordPress caching. A high-performance storage system pays off for many product images. The following table provides a compact overview of OG suitability.
| Provider | Open Graph support | SEO Tools & Social Meta | Performance | Placement |
|---|---|---|---|---|
| webhoster.de | Very good | RankMath, OG, Yoast | Very high | 1 |
| ProviderB | Good | OG, Yoast | High | 2 |
| ProviderC | Satisfactory | Basic | Medium | 3 |
Modern implementation of share buttons
Sharing is more convenient when users can share content natively. I use the native sharing function in the browser or on the smartphone instead of just relying on script buttons. This improves the user experience and saves additional requests from external widgets. I show how this works in the article on the Web Share API. In combination with strong OG snippets, the result is coherent and click-strong.
Common errors and quick solutions
Double OG tags often arise when several plugins output the same metadata. I deactivate superfluous modules and only allow one source to be written. Incorrectly cropped images lead to truncated elements in feeds, so I check formats in advance. Outdated caches conceal changes, so I force an update via the respective debug tools. Unexpected titles often come from incorrect variables, which I solve with fixed fields per post.
Twitter Cards (X) and platform differences
X (Twitter) uses its own meta tags, but accepts OG values as a fallback. For an optimal display, I also use Twitter Cards. For link previews, summary_large_image is the safest choice because it shows large images. LinkedIn and Facebook primarily read OG tags; Pinterest uses OG and its own rich pin fields. Uniform values across all platforms prevent contradictory snippets.
<meta name="twitter:title" content="" />
<meta name="twitter:description" content="" />
<meta name="twitter:image" content="" />
Important: I use absolute, publicly accessible image URLs without login barriers. Some networks do not follow every redirect or reject images with unusual MIME types. A clean 200-OK status and the correct content type specification image/webp or image/jpeg prevent misinterpretations.
Extended OG fields for articles and international websites
Article metadata help networks to understand topicality and relevance. I therefore add timestamps and categories if I display them manually or if a plugin supports this.
- article:published_time and article:modified_time in ISO-8601 format
- article:author (name or profile URL, depending on the plugin)
- article:section (e.g. category)
- article:tag (multiple tags possible)
<meta property="article:published_time" content="" />
<meta property="article:modified_time" content="" />
<meta property="article:section" content="" />
<meta property="article:tag" content="name ); ?>" />
Internationalization I solve this with og:locale and og:locale:alternate. For multilingual sites, I assign each language document its own og:url and locale (e.g. de_DE, en_US) and add alternatives. In this way, feeds provide users with the appropriate language version.
It remains important that og:url refers to the canonical URL shows. I do not add trackings such as UTM parameters to og:url, but to the actual share link. This keeps the preview consistent and the share graph does not bundle interactions on variants.
Multiple images, dimensions and alt texts
Multiple og:image-entries are permitted. Networks often select the most suitable motif from these. I also supply width, height, type and alt text so that cropping and selection work properly.
<meta property="og:image" content="" />
<meta property="og:image:width" content="" />
<meta property="og:image:height" content="" />
<meta property="og:image:alt" content="" />
I make sure that the pictures publicly available (no NoIndex/NoAuth), are delivered via HTTPS with a valid certificate and do not fail due to cookies or referer checks. CDNs may use signatures/tokens, but should offer crawlers stable, directly retrievable URLs.
Technical checks: status codes, redirects and security
Clean delivery prevents broken previews. I check for the target URL and og:image:
- HTTP status 200 (no chains from 301/302, no 403/404)
- Correct content types (text/html, image/webp/jpeg/png)
- No robots tags that block the preview (no noimageindex on images)
- Keep maximum file size moderate (images that are too large may be rejected)
- Server firewalls allow user agents such as facebookexternalhit, Twitterbot, LinkedInBot, PinterestCrawler through
For aggressive rate limiting and WAFs, I whitelist common crawler IPs or agents. I configure hotlink protection and signed CDN URLs so that share crawlers are not blocked. I consistently avoid mixed content (http images on https pages).
Headless, block themes and duplicate metadata
Block themes and headless setups require clear responsibilities. In classic themes, I attach my output to wp_head. FSE/block themes can already generate metadata, which I either extend or specifically deactivate. In headless environments, I make sure that OG and Twitter tags server-side are rendered so that crawlers can see them without JavaScript.
Duplicate metadata by switching off the OG output of a plugin as soon as I render manually (or vice versa). Examples:
<?php
// Remove Yoast OG/Twitter (if I output my own tags)
add_action( 'init', function() {
if ( defined( 'WPSEO_VERSION' ) ) {
remove_action( 'wpseo_head', [ 'WPSEO_OpenGraph', 'opengraph' ], 30 );
remove_action( 'wpseo_head', [ 'WPSEO_Twitter', 'get_instance' ], 40 );
}
});
// Remove RankMath Social
add_action( 'init', function() {
if ( class_exists( '\\RankMath\\Frontend\\Social' ) ) {
remove_action( 'wp_head', [ \RankMath\Frontend\Social::get(), 'add_tags' ], 20 );
}
});
With page builders, I check whether they have their own social modules. I consciously opt for a Source that delivers OG and Twitter consistently to avoid conflicts.
Workflow, governance and editing
Consistency is created when OG fields are part of your workflow. I work with templates for title and description lengths (e.g. 55-70 characters title, 110-160 characters description) and clear image guidelines. Editors get a quick check before publication: OG fields set, image checked, debug tools updated.
- Define image templates (border, logo, typo, contrast, 1200×630 basis)
- Integrate OG fields into the publish flow (mandatory fields in the plugin)
- UTM parameters only in share links, not in og:url
- Maintain modified_time and rescrape preview images during updates
- Consistent series images and hashtag strategy for campaigns
For stores I am planning a Product workflowStandard OG image per category, different individual images for top sellers, regular check for availability changes. In multilingual projects, I keep translations of the OG fields strictly parallel so that no language mixes occur in feeds.
GDPR-friendly sharing implementations
Privacy by not using heavyweight social scripts. The native sharing function (Web Share API) or simple, self-built share links save resources and data. I implement counting functions for shares on the server side or deliberately do without them to avoid sending unnecessary requests to third-party services. This keeps performance and data protection in balance.
Practical checklist before sharing
- og:title concise, brand-compliant, without ellipses in the feed
- og:description with clear benefit, no pure keywords
- og:url canonical, without session IDs/UTMs
- og:image 1200×630 (or larger in the same aspect ratio), WebP/JPEG, less than 1-2 MB
- og:image:width/height set, alt text available
- og:type correct (article, product, website, video)
- article:published_time/modified_time maintained
- Twitter Cards active (summary_large_image)
- Only one OG source active (no double output)
- Execute debugger for each platform, force cache refresh
- HTTP 200 for page and image, no redirect chains
- CDN/firewall lets social crawlers through
Briefly summarized
Open Graph makes your WordPress links on social media clear, appealing and consistent. With the core tags, a suitable image and clean caching, you can control the preview reliably. Plugins make it easy to get started, manual integration gives you maximum fine-tuning. Check every change in the debugger before you advertise content and keep the image quality high. This will help you achieve more clicks, greater interaction and a visible increase in your traffic.
