Fixing Mixed Content Errors on WordPress

Introduction

Mixed content errors happen when a WordPress page loads over HTTPS but some resources on the page still load over HTTP. These resources can include images, CSS files, JavaScript files, fonts, iframes, videos, plugin assets, theme files or CDN URLs.

Browsers may block insecure resources or show a “Not secure” warning even if the SSL certificate is valid. Fixing mixed content usually means finding old HTTP URLs inside WordPress settings, database content, theme files, plugins, CDN settings and cached pages, then replacing them with HTTPS versions.

Quick answer

Mixed content

Mixed content means the main page loads securely over HTTPS, but one or more resources load insecurely over HTTP.

Common mixed content resources:

• images
• CSS files
• JavaScript files
• fonts
• videos
• iframes
• embedded forms
• plugin assets
• theme assets
• CDN files
• background images
• hardcoded links

Active vs passive

Browsers treat mixed content differently depending on the resource type.

Why it happens

Mixed content is common after moving a WordPress site from HTTP to HTTPS.

Common causes:

• WordPress Address still uses HTTP
• Site Address still uses HTTP
• old image URLs in posts/pages
• hardcoded HTTP URLs in theme files
• plugin settings with HTTP URLs
• page builder content saved with HTTP URLs
• CDN URL still uses HTTP
• old CSS background images
• external fonts or scripts using HTTP
• widgets or embeds using HTTP
• cached HTML still contains HTTP URLs
• database migration kept old URLs

Where to look first

Why this matters

Mixed content can also affect SEO, conversion rate, analytics, user confidence and technical quality after an HTTPS migration.

How to find it

Use browser developer tools, SSL checks and page inspection to find insecure resources.

Check in this order:

1. Open the page in browser — look for Not Secure warnings or missing padlock.
2. Browser console — open developer tools and search for mixed content warnings.
3. Network tab — filter requests by http://.
4. Page source — search for http:// in HTML.
5. WordPress settings — confirm WordPress Address and Site Address use HTTPS.
6. Content/database — search old HTTP domain URLs in posts, pages and options.
7. Theme/plugin assets — check whether files are hardcoded with HTTP.
8. CDN/cache — clear cache and confirm CDN URLs use HTTPS.

Search page source:
curl -s https://example.com | grep -i "http://"

Check headers:
curl -I https://example.com

Follow redirects:
curl -IL http://example.com

WP-CLI dry run:
wp search-replace 'http://example.com' 'https://example.com' --all-tables --dry-run

Find HTTP URLs in theme files:
grep -R "http://" wp-content/themes/your-theme/

Find HTTP URLs in plugins:
grep -R "http://" wp-content/plugins/

Common problems

How to fix it

1. Step 1: Back up the website

   Back up files and database before changing URLs.

2. Step 2: Confirm SSL works

   Make sure the certificate is valid for the domain and HTTPS loads.

3. Step 3: Update WordPress URLs

   Set WordPress Address and Site Address to HTTPS.

4. Step 4: Replace old internal URLs

   Replace http://yourdomain.com with https://yourdomain.com using a safe WordPress-aware method.

5. Step 5: Fix page builder content

   Update saved builder CSS, background images and generated assets.

6. Step 6: Check theme and plugins

   Find hardcoded HTTP assets and update or replace them.

7. Step 7: Update CDN settings

   Make sure CDN hostname and asset URLs use HTTPS.

8. Step 8: Clear all caches

   Clear WordPress cache, plugin cache, server cache, CDN cache and browser cache.

9. Step 9: Re-test important pages

   Check homepage, service pages, blog posts, forms, checkout and admin pages.

Example 1: Image mixed content

Page:
https://example.com/about

Browser console:
Mixed Content: The page was loaded over HTTPS, but requested an insecure image:
http://example.com/wp-content/uploads/team.jpg

Fix:
Replace image URL with:
https://example.com/wp-content/uploads/team.jpg

Example 2: CSS mixed content

CSS file contains:
background-image: url("http://example.com/wp-content/uploads/bg.jpg");

Fix:
Update generated CSS or theme option to HTTPS.

Example 3: Plugin script

HTML contains:
<script src="http://thirdparty.example/widget.js"></script>

Fix:
Use HTTPS version if provider supports it or remove/replace the widget.

Search and replace

Many mixed content issues come from old URLs stored in the database.

Replace http://example.com with https://example.com for your own domain.

Important: Use tools that understand WordPress serialized data. A normal raw database replace can break serialized options.

• WP-CLI search-replace
• trusted migration plugin
• database tool that supports serialized data
• staging environment before production
• full database backup before replacement

WP-CLI examples

Dry run first:
wp search-replace 'http://example.com' 'https://example.com' --all-tables --dry-run

Run replacement:
wp search-replace 'http://example.com' 'https://example.com' --all-tables

Skip GUID column:
wp search-replace 'http://example.com' 'https://example.com' --all-tables --skip-columns=guid

Check current site URLs:
wp option get home
wp option get siteurl

Update site URLs:
wp option update home 'https://example.com'
wp option update siteurl 'https://example.com'

Theme and plugins

Some mixed content comes from code, not database content.

Check:

• header.php
• footer.php
• functions.php
• theme options
• custom CSS
• custom JavaScript
• plugin settings
• tracking scripts
• embedded widgets
• page builder generated files
• child theme files

Look for http:// hardcoded URLs, old CDN URLs, insecure font URLs, insecure script URLs and insecure iframe embeds.

Page builders can store image URLs, background images and generated CSS separately.

• section background images
• widget image URLs
• custom CSS
• global theme styles
• generated CSS files
• template library items
• header/footer builder
• popup templates
• form embeds

CDN and cache

CDN and caching layers can keep mixed content visible even after WordPress is fixed.

Check:

• CDN URL uses HTTPS
• CDN certificate is valid
• CDN rewrite rules
• cache plugin CDN settings
• image optimization CDN
• static asset cache
• full-page cache
• generated CSS cache
• browser cache
• server cache

Frequently asked questions