How can I resolve the issue of my OG images not being downloaded on my Webflow site, as indicated by the error message from the Facebook Debugger?
TL;DR
- Set OG images in Webflow’s global and page-level SEO settings using JPG or PNG format, minimum 1200×630 pixels, and without query strings.
- Ensure the image URLs are publicly accessible over HTTPS, not dynamically loaded or restricted, then re-scrape your URL in the Facebook Sharing Debugger.
If your Open Graph (OG) images aren't displaying correctly when shared (e.g., on Facebook), and the Facebook Sharing Debugger shows errors, this usually relates to how the OG images are hosted or defined in Webflow.
1. Check Your OG Image Settings in Webflow
- Go to Project Settings > SEO tab.
- Scroll down to the Open Graph Settings section.
- Make sure you’ve uploaded a valid image under “Image URL.”
- For individual pages, open the page settings, and confirm the OG image under Open Graph settings. Webflow supports a page-level override.
2. Confirm Image Hosting is Public and Statically Hosted
- Make sure the OG image file is fully hosted on Webflow or a public CDN. Images must not require authentication to access.
- Do not use CMS-hosted images if they are gated behind scripts or load dynamically.
- Open the image URL in an incognito window — if it doesn’t load directly, it won’t work for Facebook crawlers either.
3. Update Image Format and Size
- Use JPG or PNG formats (WebP is not reliably supported by all scrapers).
- Recommended size: At least 1200×630 pixels.
- File size should ideally be below 5MB.
- Use RGB color format, not CMYK.
4. Remove Query Strings From the Image URL
- Avoid URLs with added parameters (e.g.,
?version=123). Facebook may reject or fail to cache those. - Use clean, direct URLs ending in
.jpgor.png.
5. Disable “Restrict Image Indexing” (if set)
- In site settings or page settings, make sure you haven’t blocked search engine indexing.
- OG images must be crawlable by Facebook's scraper bots (which mimic regular crawlers).
6. Re-scrape With Facebook Debugger
- Go to https://developers.facebook.com/tools/debug/.
- Enter your page URL and click “Debug”.
- Click “Scrape Again” to refresh Facebook’s cache.
7. Check Webflow Hosting and SSL
- Make sure your Webflow site is published to the correct domain.
- Double-check that SSL is working — OG images must be served over HTTPS.
Summary
To resolve OG image download issues in Webflow, ensure your OG images are correctly defined in both global and page-level SEO settings, use standard formats, are accessible publicly without redirects or query strings, and are scraped again using the Facebook Debugger.