Mixed Content Errors: How to Find and Fix Them

You've installed an SSL certificate, your URLs start with https:// and you've set up redirects. Then someone notices the padlock is missing on a few pages, an image won't load, or a contact form shows a "not secure" warning. The usual culprit is mixed content: a secure HTTPS page that still pulls in some resources over plain HTTP.

Mixed content is one of the most common leftovers after an HTTPS migration, and it often lingers for years in old blog posts, theme files and third-party embeds. Modern browsers block or auto-upgrade much of it, which can quietly break images, scripts and layouts. That hurts user trust and conversions, and can affect how Google renders your pages.

This guide explains what mixed content is, why it matters for SEO and users, how to find every instance across your site, and how to fix it permanently in 2026.

Key Takeaways

• Mixed content happens when an HTTPS page loads images, scripts, stylesheets, iframes or other resources over HTTP.
• Active mixed content (scripts, stylesheets, iframes) is the most dangerous and is blocked by default in modern browsers.
• Blocked resources can break layout and functionality, harming user experience and potentially how Google renders the page.
• Find it with browser DevTools, a site crawler and Content-Security-Policy reports; fix it at the source by updating URLs to HTTPS.
• upgrade-insecure-requests is a useful safety net but not a replacement for fixing URLs or setting HSTS.

What Is Mixed Content?

web.dev defines mixed content as a page whose initial HTML is loaded over HTTPS while other resources are loaded over HTTP. The term describes the mix of secure and insecure content on a single page.

“Requesting subresources using the insecure HTTP protocol weakens the page's security.”

— web.dev, What is mixed content?

The risk is that an attacker on the network path (on public Wi-Fi, for example) can tamper with the insecure resource. With an image, that might mean swapping the picture or tracking the user. With a script, it can mean taking control of the whole page.

Types of Mixed Content

Type	Examples	Risk	Typical browser behaviour
Passive / optionally blockable	<img>, <video>, <audio>	Lower: content can be swapped or used for tracking	Often auto-upgraded to HTTPS; fails to load if no HTTPS version exists
Active / blockable	<script>, stylesheets, <iframe>, fetch/XHR requests, fonts	High: can control or alter the page	Blocked by default
Insecure form action	<form action="http://…">	High: submitted data travels unencrypted	Browsers warn users before submitting
Insecure links	<a href="http://…">	Not mixed content (it's navigation), but causes unnecessary redirects	Loads normally, may trigger redirect

web.dev notes that most browsers now block mixed content for security reasons, and that Chrome sometimes auto-upgrades passive mixed content to HTTPS; if there's no HTTPS version, the asset simply doesn't load.

Why Mixed Content Matters for SEO

Google has used HTTPS as a ranking signal since 2014, and browsers label non-secure pages prominently. Mixed content doesn't trigger a specific penalty, but it causes problems that do affect search performance:

• Broken rendering. If a blocked stylesheet or script controls layout or loads content, Googlebot may see a different, broken page.
• Lost trust and conversions. Missing padlocks, broken images and form warnings put visitors off; our HTTPS and SEO guide explains why trust signals matter.
• Extra redirects. Internal HTTP links force a redirect hop on every click and crawl request.
• Incomplete migrations. Mixed content often signals other HTTP leftovers, such as canonical tags, hreflang or sitemaps still pointing at HTTP URLs.

How to Find Mixed Content

Method	Best for	Limitations
Browser DevTools (Console / Issues tab)	Checking individual pages quickly	One page at a time; console clears on navigation
Site crawler (Screaming Frog, Sitebulb, Semrush Site Audit)	Scanning every page for HTTP resources and links	May miss resources injected by JavaScript unless rendering is enabled
Content-Security-Policy-Report-Only header	Collecting reports from real visitors	Only reports pages users actually visit; needs a reporting endpoint
Database search	Finding hard-coded http:// URLs in CMS content	Requires database access; take a backup first

web.dev's guide to fixing mixed content points out that Chrome reports mixed content in the DevTools Issues tab, and that you can check whether a resource exists securely by changing http:// to https:// in the address bar. For a full crawl, our Screaming Frog guide shows how to filter for insecure content. Semrush's HTTP vs HTTPS guide notes that its Site Audit tool flags mixed content too.

Step-by-Step: Fixing Mixed Content

1. Back up the site. You'll be editing content, templates and possibly the database.
2. Crawl and list every HTTP resource. Group by source: theme files, plugin output, post content, third-party embeds, CDN or image URLs.
3. Fix template and theme files. Replace hard-coded http:// with https:// or root-relative paths for your own assets.
4. Update content in the database. On WordPress, run a search-and-replace for http://yourdomain.com to https://yourdomain.com using a serialisation-safe tool; check the site URL settings too. See our WordPress SEO guide for related settings.
5. Handle third-party resources. Check each external URL over HTTPS. If there's no secure version, self-host it (if licensing allows), switch provider or remove it. Our notes on third-party scripts and web font optimisation help here.
6. Update CDN and image settings. Make sure your CDN serves HTTPS and that image URLs generated by plugins use it; see CDN SEO.
7. Add a safety net. Send the Content-Security-Policy: upgrade-insecure-requests header so browsers upgrade any stragglers.
8. Enforce HTTPS site-wide. 301 redirect all HTTP URLs (our .htaccess redirects guide has rules) and consider an HSTS header.
9. Re-crawl and verify. Confirm zero HTTP resources, then spot-check key pages with Google's URL Inspection tool.

About upgrade-insecure-requests

MDN describes the directive as instructing browsers to treat a site's insecure URLs as though they had been replaced with secure ones. It's a quick win, but MDN also notes it doesn't upgrade top-level navigation from third-party links and doesn't replace the Strict-Transport-Security header. It also can't help if the resource isn't available over HTTPS at all.

Content-Security-Policy: upgrade-insecure-requests;

Common Mistakes

• Relying only on a plugin. "Force SSL" plugins often rewrite output on the fly but leave the underlying content unchanged, so problems return if the plugin is removed.
• Forgetting non-HTML sources. CSS files can reference HTTP background images and fonts; JavaScript can build HTTP URLs dynamically.
• Running unsafe database replacements. Plain SQL find-and-replace can corrupt serialised data in some CMSs.
• Ignoring canonicals, hreflang and sitemaps. These should all reference HTTPS URLs after migration.
• Leaving insecure form actions. Contact and checkout forms must post to HTTPS endpoints.
• Not checking after redesigns. New themes, page builders and embeds can reintroduce HTTP URLs. Add a mixed content check to your regular technical audits.

Mixed Content During a Migration

If you're moving from HTTP to HTTPS now, plan mixed content cleanup as part of the migration, not after it. Google's site move documentation recommends server-side permanent redirects and updating internal links and sitemaps to the new URLs. Our website migration checklist includes every step.

{FAQ}

Need Help Cleaning Up HTTPS Issues?

Mixed content is simple to understand but tedious to eliminate on large or long-running sites. Our technical SEO team can crawl your site, fix templates and content safely, and set up headers to prevent regressions. Request a quote to get your padlock back everywhere.

References

1. What is mixed content? – web.dev
2. Fixing mixed content – web.dev
3. CSP: upgrade-insecure-requests – MDN Web Docs
4. Site moves with URL changes – Google Search Central
5. HTTP vs. HTTPS – Semrush

Related Guides

• Organization Schema: How to Define Your Brand for Google
• Event Schema: Get Your Events Into Google Search
• Job Posting Schema: How to Appear in Google for Jobs