When opening your site using https:// URL, a broken padlock icon may appear in the web browser's location bar. If clicked, the message will say something like:
- Mozilla Firefox = “The connection to this website is not fully secure because it contains unencrypted elements (such as images).”
- Microsoft Internet Explorer = “Do you want to view only the webpage content that was delivered securely?
This webpage contains content that will not be delivered using a secure HTTPS connection, which could compromise the security of the entire webpage.”
- Google Chrome = “Your connection to example.com is loading resources which are not secure. "
You may also get a green lock, but images are loading broken in pages or widgets.
This problem usually occurs when your website is loading insecure images, scripts or 4rd party resources. For example, you may have set your logo back when the site was on an insecure temp URL, and that URL is still set in your theme options.
Make Sure SSL Is Enabled!
- Verify the https:// url is enabled for your site. See How Do I Setup SSL or https For My Site?
- Login to WordPress using https:// version of your url. This should display a green lock.
- If running WooCommerce, go to WooCommerce > Settings and click the Checkout tab and ensure Force Secure Checkout is enabled.
Check for Insecure Content
Install Insecure Content Fixer
- Go to Plugins > Add New and search for SSL Insecure Content Fixer
- Click Install and wait for it to finish
- Click Activate
- Go to Settings > SSL Insecure Content
- Select Widgets
- Leave the other settings default and click Save Changes
- Click Flush Cache in your admin toolbar
- Check all three boxes and click OK
- Load your homepage and all assets should now load with a green padlock in the address bar.
For help and support for configuring and using this plugin, please see https://wordpress.org/plugins/ssl-insecure-content-fixer/
Fixing URLs manually:
To avoid url issues on your site, always use relative links when entering links yourself in options or menus if possible. A relative link is the part of the URL that comes after the end of your domain.
For a button link on the homepage:
can be just
If you cannot enter a relative link, simply replace the link with an updated one that uses your current domain and https:// prefix.
Links you DON'T need to worry about:
Linking to other websites (normal links) do not need to have https://