Browser Mixed Content Warnings — HTTP Resources on HTTPS Page
About Browser Mixed Content Warnings
Fix mixed content warnings and errors when an HTTPS page loads resources (scripts, images, iframes) over insecure HTTP, causing browser security warnings. This guide covers everything you need to know about this topic, including common causes, step-by-step solutions, and answers to frequently asked questions.
Here are the key things to understand: Mixed content occurs when an HTTPS page includes resources loaded over HTTP. Active mixed content (scripts, iframes, CSS) is blocked by all modern browsers. Passive mixed content (images, audio, video) shows a warning but may still load. The padlock icon in the address bar is removed or shows a warning triangle. Content Security Policy (CSP) can enforce HTTPS for all resources. Understanding these fundamentals will help you diagnose and resolve this issue more effectively.
The most common reasons this occurs include: HTML containing http:// URLs for scripts, stylesheets, or images on an HTTPS page. Third-party widgets or ads loading resources over HTTP. CMS or application generating HTTP URLs instead of HTTPS. Legacy content with hardcoded HTTP URLs. CDN not configured for HTTPS delivery. Identifying the root cause is the first step toward finding the right solution.
To resolve this, follow these recommended steps: Find mixed content: open DevTools Console — warnings list the specific HTTP resources. Change resource URLs from http:// to https:// or use protocol-relative //. Add Content-Security-Policy: upgrade-insecure-requests header to auto-upgrade HTTP to HTTPS. Update CMS settings to generate HTTPS URLs (WordPress: Settings > General > change to https). Use meta tag: <meta http-equiv='Content-Security-Policy' content='upgrade-insecure-requests'>. If these steps do not resolve the issue, consider consulting additional resources or a qualified professional.
This article is part of our Browser Errors collection on Error Codes Wiki. We provide comprehensive, up-to-date information to help you find solutions quickly.
Quick Answer
Why are scripts blocked but images are not?
Scripts can execute code and steal data (active mixed content = blocked). Images cannot execute code (passive mixed content = warned but loaded).
Overview
Fix mixed content warnings and errors when an HTTPS page loads resources (scripts, images, iframes) over insecure HTTP, causing browser security warnings.
Key Details
- Mixed content occurs when an HTTPS page includes resources loaded over HTTP
- Active mixed content (scripts, iframes, CSS) is blocked by all modern browsers
- Passive mixed content (images, audio, video) shows a warning but may still load
- The padlock icon in the address bar is removed or shows a warning triangle
- Content Security Policy (CSP) can enforce HTTPS for all resources
Common Causes
- HTML containing http:// URLs for scripts, stylesheets, or images on an HTTPS page
- Third-party widgets or ads loading resources over HTTP
- CMS or application generating HTTP URLs instead of HTTPS
- Legacy content with hardcoded HTTP URLs
- CDN not configured for HTTPS delivery
Steps
- 1Find mixed content: open DevTools Console — warnings list the specific HTTP resources
- 2Change resource URLs from http:// to https:// or use protocol-relative //
- 3Add Content-Security-Policy: upgrade-insecure-requests header to auto-upgrade HTTP to HTTPS
- 4Update CMS settings to generate HTTPS URLs (WordPress: Settings > General > change to https)
- 5Use meta tag: <meta http-equiv='Content-Security-Policy' content='upgrade-insecure-requests'>