The mixed content error in WordPress occurs when a website is served over HTTPS but includes resources (like images, scripts, or stylesheets) that are served over HTTP. This can lead to security warnings in browsers and potentially affect the site’s functionality. Here’s a step-by-step guide to fix it:

1. Backup Your Site

Before making any changes, ensure you have a complete backup of your site.

2. Update WordPress URL Settings

  • Go to Settings > General in your WordPress dashboard.
  • Make sure both the WordPress Address (URL) and Site Address (URL) are using https://.

3. Update URLs in the Database

You may need to update old HTTP URLs in your database. You can do this using a plugin or directly in the database.

Using a Plugin:

  • Install and activate the Better Search Replace or WP Migrate DB plugin.
  • Go to the plugin settings and replace all instances of http://yourdomain.com with https://yourdomain.com.

Directly in the Database:

  • Use phpMyAdmin or a similar tool.
  • Run an SQL query to replace HTTP with HTTPS, e.g.,
    sql

    UPDATE wp_options SET option_value = replace(option_value, 'http://', 'https://') WHERE option_name = 'home' OR option_name = 'siteurl';
    UPDATE wp_posts SET post_content = replace(post_content, 'http://', 'https://');
    UPDATE wp_postmeta SET meta_value = replace(meta_value, 'http://', 'https://');

4. Update Theme and Plugin Files

  • Check your theme and plugin files for hardcoded HTTP URLs.
  • Use a text editor to search and replace http:// with https:// in your theme and plugin files if necessary.

5. Update Widgets and Menus

  • Go to Appearance > Widgets and Appearance > Menus.
  • Ensure that any URLs in widgets and menu items are updated to HTTPS.

6. Check External Resources

  • Make sure any external resources you use (like CDNs, APIs) support HTTPS and update their URLs if necessary.

7. Clear Caches

  • Clear your site’s cache if you’re using a caching plugin.
  • Clear your browser cache as well.

8. Use SSL Plugins

  • Install plugins like Really Simple SSL or SSL Insecure Content Fixer to help automatically detect and fix mixed content issues.

9. Test Your Site

  • Use browser developer tools (F12 > Console tab) to check for any remaining mixed content warnings.
  • Test your site on different devices and browsers to ensure everything is functioning correctly.

If you follow these steps and still encounter issues, you might want to check your web server configuration or contact your hosting provider for additional support.