Free tools Windows power users keep installed
One-click scans. No signup required.
To give a Facebook link a representative image, add an og:image URL to the page’s HTML <head>, alongside the Open Graph properties og:title, og:type, and og:url. Add the optional structured image properties—especially og:image:alt—after the image declaration. The Open Graph specification defines this metadata; Facebook’s current preview size, file limits, crawler behavior, and cache-refresh process are separate implementation details that must be checked in current Facebook documentation.
What an Open Graph image does
The Open Graph protocol enables a web page to become a rich object in a social graph. For a Facebook share, og:image identifies the image that represents the page when its URL is processed.
![Marketing Magic: How I produced 7 billion views, 50 million social media followers and $250,000,000 in yearly revenue without paid advertising! ... ... Manuel Suarez [Hardcover] Manuel Suarez](https://m.media-amazon.com/images/I/41DEmJulOkL._SL160_.jpg)
The protocol defines four basic properties for every object:
og:title— the page’s title.og:type— the object type, such aswebsite.og:image— the representative image URL.og:url— the canonical URL and permanent identifier for the object.
These are metadata properties, not visible page content. They belong in the document’s <head>, and the image URL should be a real, reachable URL in your production environment.
Windows Errors? Fix Them Before They Spread
Repair common Windows errors and clear accumulated junk for a smoother, more stable PC - no reinstall needed.Free scan · no reinstallOutdated Drivers Are Slowing You Down
One free scan finds every outdated or missing driver and matches the right update for your exact hardware.Free scan · exact hardware match#1 Best Overall
Minimal HTML implementation
Use this as the smallest protocol-conforming starting point, replacing the example values with your own canonical URLs:
<html prefix="og: https://ogp.me/ns#">
<head>
<meta property="og:title" content="Page title" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:image" content="https://example.com/share-image.jpg" />
</head>
</html>The prefix declaration identifies the Open Graph namespace used by the properties. Keep one canonical page URL in og:url; do not substitute a tracking URL or a shortened link.
Describe the image with structured properties
The protocol supports additional properties that make the image declaration more explicit:
| Property | Purpose |
|---|---|
og:image:url |
The same image URL as og:image. |
og:image:secure_url |
An alternate URL to use when the page requires HTTPS. |
og:image:type |
The image MIME type, such as image/jpeg or image/png. |
og:image:width |
The image width in pixels. |
og:image:height |
The image height in pixels. |
og:image:alt |
An accessible description of the image; it is not a visible caption. |
The specification says to include og:image:alt when an image is specified. A complete declaration can therefore look like this:
Rank #2
<meta property="og:image" content="https://example.com/share-image.jpg" />
<meta property="og:image:secure_url" content="https://example.com/share-image.jpg" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="A dashboard showing monthly sales trends" />The numeric values above are examples of metadata, not Facebook requirements. Use the actual pixel dimensions and MIME type of your file.
How multiple Open Graph images work
You can provide more than one image by repeating og:image. When values conflict, the protocol gives preference to the first value in document order. Put each image’s structured properties immediately after its root og:image tag and before the next root image declaration.
<meta property="og:image" content="https://example.com/primary.jpg" />
<meta property="og:image:alt" content="Primary product photograph" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image" content="https://example.com/alternate.jpg" />
<meta property="og:image:alt" content="Alternate product photograph" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />Do not put all structured properties at the end of the document: their position determines which image they describe.
Adding the tags in different publishing setups
Static or server-rendered HTML
- Open the template that emits the page’s
<head>. - Insert the four basic properties and the image properties shown above.
- Deploy the template and view the live page source, not only the editor preview.
- Confirm that the URLs are absolute, use the intended protocol, and do not require a logged-in session.
Content-management systems
Use the system’s Open Graph or social-sharing fields if they generate tags in the server-rendered head. If a plugin provides both a site-wide default image and a per-page image, inspect the final HTML to ensure the intended page image is the first og:image. Avoid adding a second plugin that emits competing tags unless you can control their order.
Rank #3
JavaScript-rendered pages
Social parsers may inspect the initial HTML response rather than waiting for your browser-side application to finish rendering. Generate the Open Graph tags in server-rendered HTML or an equivalent pre-rendered response so they are present in the source delivered for the URL.
Image URL and hosting checks
- Use an absolute URL, including
https://where applicable. - Serve the image from a stable public location; a private bucket, expiring URL, or login wall can prevent retrieval.
- Make the response match the declared type. If you declare
image/jpeg, serve the corresponding JPEG rather than a different format. - Keep the canonical page URL in
og:urlconsistent with the URL you expect people to share. - Use meaningful alternative text in
og:image:alt; describe the image itself rather than repeating the page title.
The Open Graph specification does not establish a current Facebook pixel recommendation, maximum file size, supported-format matrix, crawler allowlist, or cache invalidation procedure. Treat those as Facebook-platform behavior that can change independently of the protocol and verify them against current Facebook documentation before relying on a specific limit or refresh step.
Checking what Facebook can parse
The protocol page identifies Facebook Object Debugger as Facebook’s official parser and debugger. Its current interface and availability are not established by the protocol specification, so use the current Facebook documentation to locate the supported tool. In any parser, inspect the raw properties it reports rather than judging only by a visual preview:
- Enter the exact URL that will be shared.
- Check that
og:title,og:type,og:url, andog:imageare present once in the intended order. - Verify that the image URL is absolute and points to the expected asset.
- Confirm that width, height, MIME type, and alt text belong to the correct root image when multiple images are present.
- After changing metadata, inspect the fetched values again and account for any platform caching behavior documented by Facebook.
Common failures and fixes
No image appears
Inspect the live HTML source for og:image. If it is absent, the tag may have been added to a client-side component, the wrong template may be deployed, or a CMS field may not be enabled. Add it to the server-rendered <head> and retest the exact shared URL.
The wrong image is selected
Search for every og:image. The first value has protocol-level precedence when values conflict. Remove stale declarations or move the desired image to the first position, then place its structured properties directly below it.
Image metadata describes another file
Check tag order. Structured properties attach to the image declared immediately before them. Reorder each group so its og:image:alt, dimensions, type, and secure URL follow that image’s root tag.
The image URL works in a browser but not for a parser
A browser session may have cookies or authentication that a parser does not. Test the asset as an anonymous request, confirm that redirects end at the intended public file, and remove access controls or expiring links from the shared asset.
Changes are not visible immediately
First verify that the origin server now returns the new tags. If the parser still reports older values, follow Facebook’s current cache-refresh guidance rather than assuming that adding a query string or repeatedly sharing the link will invalidate its cache.
Do these 3 things before closing this tab:
1Clear out junk files and repair common Windows errors2Fix the driver behind crashes, sound loss and screen glitches3Repair Windows errors before they cause bigger problemsPreview dimensions are unexpected
The protocol defines the image URL and optional pixel metadata, but it does not prescribe Facebook’s current card layout. Check the source dimensions and the platform’s current rendering guidance; do not infer a universal size rule from the specification’s illustrative 400-by-300 example.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.A repeatable publishing checklist
- Set
og:title,og:type,og:url, andog:imagein the HTML head. - Use the canonical page URL and a public absolute image URL.
- Add
og:image:alt; add secure URL, MIME type, width, and height when they describe the actual file. - For multiple images, place each structured group after its root image and put the preferred image first.
- Inspect the deployed source and test with Facebook’s currently supported parser or debugger.
- Document the image’s source file and dimensions in your publishing workflow so future edits keep metadata accurate.
Or skip the browser setup
If you need to create the image asset itself, ScreenshotNeo can capture a clean website screenshot through one request. It accepts consent banners before capture and removes more than 60 known consent platforms, newsletter popups, and chat widgets; failed loads, bot checks, CAPTCHAs, blank pages, timeouts, and cache hits are not billed, and response headers identify the page verdict and billing result. Its MCP server provides take_screenshot, get_page_info, and capture_pdf tools for Claude, Cursor, and other MCP clients.
Example cURL (see the ScreenshotNeo API documentation):
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpPython:
import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)Node.js:
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);Every feature is available on every plan: the Free plan includes 1,000 shots per month with no card; paid plans start at $5 for 3,000 shots. Sign up for the free ScreenshotNeo plan.
Quick wins for a faster PC:
Repair Windows errors before they cause bigger problemsFix Now →Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Clear out junk files and repair common Windows errorsFree Scan →Frequently Asked Questions
Is `og:image` the same as an HTML `![]()
` element?
No. `og:image` is metadata in the document head that identifies a representative image for social parsers; an `` element displays an image within page content.
Can I use a relative path such as `/share.jpg`?
Use an absolute URL such as `https://example.com/share.jpg` so a parser can resolve the asset independently of page context.
What does `og:image:alt` contain?
It contains a description of the image, not a caption that Facebook must display with the preview.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
