What is mixed content?

An HTTPS page that loads a script, image, style or frame over plain http://. That one request can be read or changed in transit, which undoes the protection of the rest of the page.

Why do some resources break and others only warn?

Browsers block active content such as scripts, styles and frames outright. Images, audio and video are upgraded to HTTPS automatically or shown with a warning, depending on the browser.

How do I find every insecure resource?

Open the browser console on the page: each one is logged as a Mixed Content message with its URL. EngineeringScore lists the http:// requests it saw while loading the page and quotes up to five of them.

Security Medium

Mixed content warning: how to fix it

Fix mixed content

Mixed content happens when an HTTPS page loads a resource (a script, stylesheet, image, or iframe) over plain HTTP. Modern browsers block "active" mixed content like scripts outright and often show a broken-padlock warning even for "passive" mixed content like images, undermining the trust HTTPS is supposed to provide.

Find out whether your site has this problem, and every other check, in one free scan.

Check your site free

Why it matters

Mixed content (HTTP resources loaded on an HTTPS page) is blocked or flagged by modern browsers and gives attackers a way to tamper with an otherwise-secure page by intercepting the insecure resource.

How to fix

1 Search the codebase and CMS content for hardcoded http:// URLs.
2 Replace them with https:// or protocol-relative URLs.
3 Add a CSP upgrade-insecure-requests directive as a safety net.

Fix it in your stack

HTML

Change each http:// resource URL to https://, after checking the host serves it over HTTPS.

<img src="https://cdn.example.com/logo.png" alt="Example">

Nginx

A stopgap while you fix the links: ask browsers to upgrade the requests themselves.

# server block, HTTPS site
add_header Content-Security-Policy "upgrade-insecure-requests" always;

WordPress

Set both URLs in Settings, then General, to https://, then rewrite the old URLs stored in posts with WP-CLI.

wp search-replace 'http://example.com' 'https://example.com' --skip-columns=guid

Common mistakes

Hardcoding http:// URLs in markup, CSS, or CMS content that was written before the site migrated to HTTPS.
Pulling resources from a third-party or legacy service that has not itself migrated to HTTPS, which cannot be fixed by changing the URL alone.
Fixing the obvious cases (images) but missing less visible ones like fonts, iframes, or XHR/fetch requests made from JavaScript.

How to verify

1 Open devtools console while browsing the site and check for mixed-content warnings.
2 Search the codebase and CMS content for hardcoded http:// references.
3 Confirm a CSP upgrade-insecure-requests directive (if added) does not mask resources that are actually still broken over HTTPS.

Questions

What is mixed content?: An HTTPS page that loads a script, image, style or frame over plain http://. That one request can be read or changed in transit, which undoes the protection of the rest of the page.
Why do some resources break and others only warn?: Browsers block active content such as scripts, styles and frames outright. Images, audio and video are upgraded to HTTPS automatically or shown with a warning, depending on the browser.
How do I find every insecure resource?: Open the browser console on the page: each one is logged as a Mixed Content message with its URL. EngineeringScore lists the http:// requests it saw while loading the page and quotes up to five of them.

Ready to see where you stand?

Scan your site and get your Engineering Score with a prioritized roadmap in under a minute, no signup required.

Scan your site