SteadyHost

Mixed content: http:// on an HTTPS page

Mixed content means a page is loaded over HTTPS, but some of its resources, such as scripts, images or iframes, are loaded over plain http://. Those resources aren't encrypted. Browsers therefore block them or show a warning, which can make your page look broken.

Check your website now

Active and passive mixed content

Browsers distinguish between resources that can control the page and resources that only display something.

  • Active: scripts, stylesheets, iframes and object or embed elements. Anyone who alters them in transit can take over the whole page. Browsers block them, so menus, layout or forms stop working.
  • Passive: images, audio and video. Modern browsers automatically try to load them over https:// and block them if that fails; older browsers show them with a warning. The padlock in the address bar can then no longer be relied on.
  • Forms: a form on an HTTPS page that submits its data to an http:// address sends everything the visitor enters across the internet unencrypted. Browsers warn about this too.

Where it comes from

Mixed content usually appears after switching to HTTPS. Old http:// addresses are left behind in page content, in the theme or template, in CMS settings, or in embed codes from third-party services such as a map, video or widget.

In WordPress, for example, the site address is stored in the settings (WordPress Address and Site Address) and in the database, in the content of posts and pages.

How to fix it

Replace http:// with https:// everywhere, or refer to the resource without a domain name if it's on your own site. First check that the resource is actually reachable over HTTPS.

  • Update the addresses in the source code, theme or template.
  • Set your site's address in the CMS settings to https://.
  • Run a search and replace in the database for addresses in the content. Make a backup first; for WordPress there are plugins and WP-CLI for this (wp search-replace).
  • Update embed codes from third-party services to their https:// version, or replace the service if it doesn't support HTTPS.

Temporary fix: upgrade-insecure-requests

If you can't fix everything right away, you can ask browsers to automatically load all http:// resources over https://. This only works if those resources are also reachable over HTTPS. Treat it as a temporary measure: fix the addresses properly afterward.

HTTP header
Content-Security-Policy: upgrade-insecure-requests

Find mixed content yourself

Open your website in the browser and look at the Console tab in the developer tools (F12): the browser reports every resource it blocked or warned about as mixed content there. Check a few other pages this way too, such as your contact page and your online store.

How SteadyHost rates mixed content

  • OK: the homepage HTML doesn't load any resources over http://.
  • Warning: images, audio or video are loaded over http://, or a form submits to an http:// address.
  • Problem: scripts, stylesheets, iframes or other active resources are loaded over http://.
  • Not available: the homepage isn't reachable over HTTPS.
  • SteadyHost only checks the HTML of the homepage. Resources loaded later by JavaScript, and other pages, are outside the scope of the check. This check doesn't count toward the score.

Check your own website

A free check shows within seconds how your website is doing: availability, HTTPS and TLS, the SSL certificate, security headers, DNS and DNSSEC, domain registration and email security.

More guides