How can I resolve the issue of images not being displayed on the published Webflow site due to a lack of authorization?
TL;DR
- Upload all images directly to Webflow’s Asset Manager to avoid permission or cross-origin issues.
- Verify image URLs don't require authentication, check file permissions are public, and republish the site to clear cached image data.
If images are not showing on your published Webflow site and you're seeing authorization-related errors, it's likely due to broken links, restricted file permissions, or incorrect hosting settings.
1. Check Image Hosting Source
- If you're referencing external images (not uploaded to the Webflow Assets panel), the source might require authentication or restrict hotlinking.
- Visit the image URL in a private browser window. If it doesn’t load there, the image host is blocking public access.
- Solution: Upload all images directly to Webflow’s Asset Manager to avoid cross-origin or permission issues.
2. Inspect Image URLs
- Right-click the missing image spot on your published site and choose Inspect (in Chrome or similar) to examine the image’s
srcattribute. - Ensure the image URLs:
- Start with https://assets.website-files.com/ if hosted by Webflow.
- Do not point to localhost or a local file path like
file:///.... - If the image URL has authentication tokens (e.g., long query strings), it may have expired.
- Re-upload or relink the image within Webflow.
3. Review File Permissions
- If you uploaded images to a third-party server (e.g., Amazon S3, Dropbox, Google Drive), confirm those files are shared publicly.
- Set the file to public/read-only access so that Webflow doesn’t need authentication to fetch it.
4. Clear Webflow CDN Cache
- Sometimes cached content on Webflow’s CDN may prevent updated images from appearing.
- In Designer, remove the image and re-upload it to force a cache refresh.
- Republish the site by clicking Publish > Publish to Selected Domains.
5. Disable Password Protection (if applicable)
- Go to Project Settings > Hosting > Password Protection, and make sure it's turned Off, unless you intentionally protected the site.
- If password protection is enabled, some media resources might require authorization depending on how they're loaded.
Summary
Host all images directly through Webflow’s asset manager, verify image URLs don’t require authentication, ensure file permissions are public, and republish your site to clear the cache. This ensures images load correctly without needing any authorization.