What is mixed content and why does it break the padlock?

Mixed content is when a secure (https) page loads some of its images, scripts or styles over plain http. Browsers respond by removing the padlock, showing a warning, or blocking the insecure file altogether, which can break layouts and features. It usually comes from old content, and the fix is to update the addresses.

Why it matters

A page is only as secure as its least secure part. An insecure script could be swapped on the way to the visitor, so browsers block insecure scripts entirely and the feature they powered stops working. Insecure images are shown but the padlock disappears and Chrome labels the page "Not secure", which is the impression visitors take away even though you paid for and installed a certificate.

Where it comes from

The site was built on http and later moved to https, and the content still holds full http addresses: images pasted into pages, a logo in the theme settings, a font or script from an old embed code, a link in a widget. Each of those loads insecurely until it is changed.

How to check

Our check lists every http address it finds in the images, scripts and stylesheets on your home page. In a browser, the padlock is replaced by a warning icon and the developer console lists each blocked or insecure file.

How to fix it

On WordPress, run a search-and-replace plugin such as Better Search Replace, changing "http://yourdomain" to "https://yourdomain" across the database, then check the theme settings and widgets by hand. Change embed codes from third parties to their https versions, which all of them now offer. As a safety net, the Content-Security-Policy header "upgrade-insecure-requests" tells browsers to try https for anything still referenced as http, which fixes stragglers automatically.

Not sure how your own site does on this? Run the free check: it takes about twenty seconds and reports on this and thirty other things.

Check my website

More guides