If your Open Graph (OG) images are not displaying in the Facebook Debugger, it usually indicates an issue with how Facebook is accessing or downloading those images.
1. Verify OG Image Setup in Webflow
- Go to your Webflow Page Settings (click the gear icon next to a page).
- Scroll to the Open Graph Settings section.
- Ensure that an OG image is uploaded or provided via a direct URL.
- The image should be at least 1200 x 630 pixels for best display quality.
2. Check OG Tags in Page Source
- After publishing, view the live page and Inspect the HTML source.
- Look for the correct OG meta tag:
<meta property="og:image" content="https://...your-image.jpg">
- Make sure the URL is absolute (starts with
https://
) and publicly accessible.
3. Use Facebook Sharing Debugger
- Go to the Facebook Sharing Debugger.
- Enter your page URL and click Debug.
- Click Scrape Again to update Facebook’s cache.
- Check for errors like:
- "Could not download the image"
- 403 Forbidden
- Timeouts
4. Check Image Hosting & Privacy Settings
- If you’re using Webflow CMS or static images, they should be accessible by default.
- For external image URLs, ensure they:
- Are not blocked by firewalls or IP restrictions.
- Allow hotlinking (some hosts block Facebook user-agents).
- Are served over HTTPS.
- Facebook supports common image formats like JPG, PNG, and GIF.
- Avoid WebP, as it may not render correctly in OG tags.
- The file size should ideally be under 5 MB to prevent timeouts.
6. Verify the Image URL is Public
- Paste the OG image URL directly into a browser incognito or private window.
- If it doesn't load, neither can Facebook. Ensure it's not restricted to logged-in users or staging environments.
7. Inspect Webflow CDN or Hosting Issues
- Webflow serves assets via CDN. Occasionally, this triggers an HTTP 403 or Access Denied error for bots.
- If you're receiving a Facebook Debugger error like “403 Forbidden”, contact Webflow Support, and include:
- The affected page URL
- The exact OG image URL
- A screenshot of the Debugger error
They can escalate to the hosting/CDN team if needed.
Summary
Check that your OG images are correctly set up in Webflow, are publicly accessible over HTTPS, and served in a supported format. Use the Facebook Debugger to identify specific issues, and contact Webflow Support if CDN-related errors (like 403s) persist.