My Logo Is Not Showing When Switching to HTTPS (SSL)

If you have setup your website on the regular HTTP protocol but later down the road you’ve switched to use the secure HTTPS (SSL) protocol, chances are that after the switch you cannot see your logo anymore. The problem is prominent in Chrome browser but may also appear in other browsers.

Why This Happens?

If your website is loaded from secure HTTPS protocol, all the resources have to be served over the https://... as well. If that’s not the case, the attacker could exploit this and serve malicious code through the resource that is not handled via SSL. To prevent this, Google Chrome (and other browsers) are blocking the resources from the http://... to be loaded altogether.

How to Solve the Problem?

First, you have to identify which files are the problematic ones. Chrome browser will tell you that in the Console.

  1. Open the DevTools
  2. Open the Console tab
  3. Look for the errors that are similar to this:
    Mixed Content: The page at 'https://www.yourdomain.com/' was loaded over HTTPS, but requested an insecure image 'http://www.yourdomain.com/wp-content/uploads/2017/12/yourlogo.jpg'. This request has been blocked; the content must be served over HTTPS.
mixed content https ssl error in chrome devtools console
Screenshot of Chrome DevTools Console

You can solve the problem the following way:

  1. Most of the times, the problem is that you forgot to change the URLs in your general WordPress settings. Go to Settings > General and update them to include https:// protocol at the beginning of the URLs:
    wp general settings screenshot https
  2. Upload again any images or other media files you’ve identified previously in the console. Usually, you can upload your logo again in the Customizer > Theme Options > Logo.

If you cannot identify the problem or you believe that there’s a problem in the theme, open a new support ticket and we’ll help you out.