How to Fix Mixed Content Warnings on Your WordPress Site and Keep Your SSL Working

You paid for an SSL certificate. You set up HTTPS. Your site should show that green padlock in the browser. But instead, you see a warning triangle or a message that says "Not Secure" because of mixed content.

This happens when your WordPress site loads some resources over HTTP (insecure) instead of HTTPS (secure). Even one insecure image, stylesheet, or script breaks your SSL padlock. Customers see the warning and wonder if your site is safe to use. Search engines notice too, and it can hurt your rankings.

The good news is that mixed content warnings are usually easy to fix once you know where to look. Here's how to track down every insecure resource and make sure your entire site runs over HTTPS.

What Causes Mixed Content Warnings

Mixed content happens when your page is served over HTTPS, but it loads resources like images, stylesheets, JavaScript files, or fonts over HTTP. Browsers flag this because an attacker could intercept those insecure resources and inject malicious code.

Common causes include:

• Hardcoded HTTP URLs in your theme or plugins
• Old images uploaded before you switched to HTTPS
• Third-party scripts or embeds that still use HTTP
• WordPress site URL settings that aren't fully updated
• Content copied from another site that includes HTTP links

The fix usually involves updating those URLs to HTTPS or removing the insecure resources entirely.

Check Your WordPress Address Settings First

Before you hunt for mixed content, make sure WordPress itself knows your site uses HTTPS. Log into your WordPress admin and go to Settings, then General. Look at the WordPress Address and Site Address fields. Both should start with https://, not http://.

If either field still shows HTTP, update them to HTTPS and save. This won't fix everything, but it prevents WordPress from generating new insecure URLs going forward.

Use Your Browser to Find Mixed Content

Modern browsers tell you exactly what's causing the warning. Open your site in Chrome or Firefox, then open the browser's developer console. In Chrome, press F12 or right-click and choose Inspect. Click the Console tab.

Reload your page. If you have mixed content, you'll see warnings in red or yellow that say "Mixed Content" and list the insecure URLs. Write down or screenshot those URLs so you know what to fix.

Check multiple pages, especially your homepage, product pages, and blog posts. Mixed content often hides in specific templates or content areas.

Fix Hardcoded HTTP URLs in Your Database

The most common culprit is old HTTP URLs stored in your WordPress database. These often come from images, links, or embeds added before you switched to HTTPS.

You can manually search and replace these URLs using a plugin like Better Search Replace. Install the plugin, then go to Tools and Better Search Replace. In the Search field, enter your old HTTP URL (like http://yoursite.com). In the Replace field, enter your new HTTPS URL (https://yoursite.com).

Select all tables and check the box to run as a dry run first. This shows you how many replacements would be made without actually changing anything. If the number looks reasonable, uncheck dry run and click Run Search/Replace.

This fixes most mixed content in posts, pages, and custom fields. Make sure you have a recent backup before running any search and replace operation.

Check Your Theme and Plugin Files

Some mixed content is hardcoded directly in theme or plugin files. If the browser console shows an insecure URL for a CSS file, JavaScript file, or font, check your theme's code.

Look for any lines that include http:// in your theme's header.php, footer.php, or functions.php files. Replace http:// with https:// or better yet, use protocol-relative URLs that start with // instead.

If the insecure resource comes from a plugin, contact the plugin developer or check for an update. Most modern plugins handle HTTPS automatically, but older or poorly coded plugins may not.

Force HTTPS Across Your Entire Site

Even after fixing mixed content, you want to make sure all traffic uses HTTPS. Add this code to your .htaccess file (if you're on Apache) to redirect all HTTP requests to HTTPS:

Place this code near the top of your .htaccess file, just below RewriteEngine On. This ensures that even if someone types your URL without HTTPS or clicks an old HTTP link, they'll be redirected to the secure version.

If you're not comfortable editing .htaccess, a plugin like Really Simple SSL can handle redirects for you. Just be aware that adding another plugin increases complexity. If your security setup is already solid, a simple .htaccess rule is often cleaner.

Update External Resources and Embeds

Sometimes mixed content comes from resources you don't control, like embedded videos, social media feeds, or third-party scripts. Check any YouTube embeds, Google Maps, analytics scripts, or advertising code.

Most major services support HTTPS now. Update embed codes to use HTTPS URLs, or regenerate the embed code from the service's website. For example, YouTube embed codes should start with https://www.youtube.com, not http://.

If a third-party service doesn't support HTTPS, consider whether you really need it. An insecure embed can break your SSL and hurt customer trust. In most cases, it's better to find an alternative or remove the resource entirely.

Verify Your SSL Certificate Is Installed Correctly

Mixed content warnings can also appear if your SSL certificate isn't configured properly. Use a free tool like SSL Labs Server Test to scan your site. Enter your domain and wait for the report.

A properly configured site should get an A or A+ rating. If you see warnings about certificate chain issues, expired certificates, or weak encryption, contact your hosting provider. They can reinstall or update your SSL certificate.

If you're managing your own WordPress hosting and security, make sure your certificate includes all necessary intermediate certificates and is set to auto-renew.

Test Your Site After Making Changes

After fixing mixed content, clear your browser cache and test your site in multiple browsers. Load several pages and check that the padlock icon appears without warnings.

Use an online tool like Why No Padlock to scan your entire site for remaining mixed content. It crawls your pages and reports any insecure resources you might have missed.

Check your site on mobile devices too. Mobile browsers are often stricter about mixed content and may block insecure resources entirely instead of just showing a warning.

Prevent Mixed Content Going Forward

Once your site is fully HTTPS, keep it that way. When you add new content, paste links, or embed resources, double-check that URLs start with HTTPS.

Use relative URLs whenever possible (like /images/photo.jpg instead of https://yoursite.com/images/photo.jpg). Relative URLs automatically match your site's protocol, so they'll always use HTTPS if your site does.

Keep your plugins and themes updated. Developers fix HTTPS compatibility issues in updates, and staying current prevents new mixed content warnings from appearing.

If you'd rather have someone else handle SSL configuration and ongoing security monitoring, a maintenance plan can take that work off your plate and make sure your site stays secure without constant attention.

Image credit: Photo by Daniel Trylski on Pexels.