How to Optimize Images for Facebook Sharing

To control the image Facebook uses when someone shares a link to your page, add an explicit og:image tag in the page’s HTML head and point it to your intended image. A practical target is 1200 × 630 pixels (about 1.91:1); Wix recommends keeping the file at or below 8 MB and says images under 600 × 315 pixels may appear as a small preview. These size figures are Wix-published guidance attributed to Facebook Sharing Best Practices, not independently verified current Meta requirements.

1. Prepare the share image

Create a purpose-made image for the page you want people to share. Use a 1200 × 630 pixel canvas as the target recommended by Wix. Compose the important subject and any essential branding for a wide preview, and avoid placing critical details right against the edges because display contexts may crop the image.

• Dimensions: 1200 × 630 pixels (approximately 1.91:1).
• File size: Wix recommends no more than 8 MB.
• Small-image guidance: Wix says images below 600 × 315 pixels may appear as a small preview.
• Format: The cited Open Graph Protocol material defines og:image as an image URL but does not establish a required file format. Use an image format your site can serve reliably.

These dimensions are practical guidance, not a guarantee that every Facebook placement or device will show an identical crop.

2. Add Open Graph metadata

In the HTML <head>, set the basic Open Graph properties: og:title, og:type, og:image, and og:url. The Open Graph Protocol lists these as its basic required properties. Make each value specific to the page being shared.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>A guide to growing herbs indoors</title>

  <meta property="og:title" content="A Guide to Growing Herbs Indoors">
  <meta property="og:type" content="article">
  <meta property="og:image" content="https://example.com/images/indoor-herbs-share.jpg">
  <meta property="og:url" content="https://example.com/guides/indoor-herbs">
</head>
<body>
  <h1>A Guide to Growing Herbs Indoors</h1>
</body>
</html>

Replace the example domain, title, image URL, and page URL with values for your own page. The og:image value should identify the image you prepared, not a general site logo or an unrelated thumbnail.

Choose the implementation path that fits your site

• Site template or page source: Set tags directly when you control the code and need explicit per-page selection.
• CMS or SEO plugin: Use its social-image controls when that is how you manage pages, then inspect the rendered page source. The protocol defines the metadata; it does not require a particular CMS or plugin.

Whichever path you choose, check the published HTML output. A value saved in an editor is useful only if the page actually emits the intended metadata.

3. Inspect and refresh the page in Facebook Sharing Debugger

1. Open the published page and inspect its HTML source or rendered head metadata.
2. Confirm that og:image points to your intended share image and that og:title, og:type, and og:url describe the same page.
3. Enter the page URL in Facebook Sharing Debugger to inspect the information Facebook has for it.
4. After changing og:image, use the debugger again to refresh or inspect the stored page information.
5. Retest by sharing the page URL and reviewing the resulting preview.

The Open Graph Protocol identifies Facebook Object Debugger as Facebook’s official parser and debugger. Wix also recommends using Facebook Sharing Debugger after changing the image metadata.

4. Troubleshoot a missing or incorrect preview image

What you see	What to check	Next step
A logo or unrelated thumbnail appears	The page may be publishing a different og:image value than the one selected in your CMS or template.	Inspect the page’s output and correct the tag, then inspect the page again with Facebook Sharing Debugger.
No image appears	Check whether the page output contains an og:image tag and whether it points to the intended image URL.	Correct the metadata if needed and use the debugger to inspect the page information.
The old image remains after an update	Facebook may still have stored information from before the metadata change.	Enter the page URL in Facebook Sharing Debugger after the update so you can refresh and inspect the stored information.
The image appears small	Compare the image dimensions with Wix’s recommendations: 1200 × 630 pixels, and at least 600 × 315 pixels to avoid the small-preview treatment it describes.	Prepare a larger image at the recommended target size, update og:image, and inspect again.
The crop does not match the design	The image may not have been composed for a wide preview, or important details may sit near an edge.	Adjust the composition for the 1.91:1 canvas and keep essential details away from edges. Retest the actual share.

This checklist follows the available Open Graph and Wix guidance; it is not a claim that every possible preview issue has a single documented cause or fix.

5. Capture a page preview while checking your metadata

A screenshot can help you review how the page itself looks, but it does not replace checking the Open Graph tags or the Facebook preview. If you need a page capture for review, ScreenshotNeo is a website screenshot API and MCP server for developers. Its API can return a PNG, JPEG, WebP, or PDF from one GET request.

Or skip the browser setup

Use ScreenshotNeo’s API to capture a page without setting up a browser locally. See the ScreenshotNeo API documentation for the request options.

curl -G "https://api.screenshotneo.com/v1/shot" \
  -d access_key=YOUR_API_KEY \
  --data-urlencode url=https://example.com/guides/indoor-herbs \
  -o shot.webp

import requests

r = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={
        "access_key": "YOUR_API_KEY",
        "url": "https://example.com/guides/indoor-herbs",
    },
    timeout=90,
)
r.raise_for_status()
open("shot.webp", "wb").write(r.content)

const q = new URLSearchParams({
  access_key: 'YOUR_API_KEY',
  url: 'https://example.com/guides/indoor-herbs'
});
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
const fs = await import('node:fs/promises');
await fs.writeFile('shot.webp', Buffer.from(await res.arrayBuffer()));

ScreenshotNeo accepts cookie and consent banners like a visitor and removes more than 60 known consent platforms, newsletter popups, and chat widgets before capture; each step can be turned off. Bot checks or CAPTCHAs, blank pages, timeouts, failed loads, and cache hits cost nothing, and the response identifies the page verdict and billing status in headers. Its MCP server provides take_screenshot, get_page_info, and capture_pdf for Claude, Cursor, and other MCP clients. The free plan includes 1,000 shots per month with no card; paid plans start at $5 for 3,000 shots. Create a free ScreenshotNeo account to start with 1,000 screenshots a month, no card required.

Performance, reliability, and cost notes

• Keep the chosen image stable: The page metadata should continue to point to the intended share image when someone shares the page. After changing that selection, inspect the page with the debugger again.
• Plan for preview refreshes: A metadata edit may not immediately change information Facebook already has stored. Use Sharing Debugger after updates and verify the actual share.
• Optimize the image file: Follow Wix’s recommendation to stay at or below 8 MB while retaining the target dimensions and a clear composition.
• Separate page capture from social preview validation: A screenshot shows a rendered page; the Open Graph tags and debugger workflow address the link preview metadata.
• ScreenshotNeo billing: Only clean shots are billed. Bot checks/CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed. Plans range from Free (1,000 per month) through $5 for 3,000, $15 for 15,000, $39 for 60,000, $99 for 250,000, and $249 for 1,000,000; yearly billing gives two months free, and every feature is available on every plan.

Frequently asked questions

Is a CMS featured image enough?

Not necessarily. The key check is whether the published page emits the intended og:image value. A CMS control is one way to set it, but inspect the output.

Does this guarantee the same preview everywhere?

No. The supplied guidance does not promise an identical appearance across every placement or device. Use the recommended wide canvas, inspect with the debugger, and review an actual share.

Do I need an SEO plugin?

No particular plugin is required by the Open Graph Protocol. You can set the properties in a template or page source, or use a CMS control that produces the correct tags.

Sources

• Open Graph Protocol — defines the image property and lists the basic metadata properties.
• Wix Help Center: Setting up the og:image meta tag — publishes the cited image size, aspect ratio, file size, and debugger guidance.
• Facebook Sharing Debugger — Facebook’s page information inspection tool.