Home > Computers, Networking > WordPress and SSL: How to convert your WP site to use HTTPS

WordPress and SSL: How to convert your WP site to use HTTPS

August 7th, 2016

WordPress SSLEveryone seems to be moving towards using “SSL” (which is actually TLS) so that entire sites load with the HTTPS protocol.

In some cases, this is a rather simple affair. But if you have a WordPress-powered site, it’s a bit more complicated than one would expect.

After all, WordPress is supposed to make everything easy, right?

Well, no.

So, here’s a list of tricks to make your WordPress SSL Conversion go as smoothly and quickly as possible!

Set up SSL

Obviously, the first thing you’ll need to do is actually install an SSL certificate for your domain.

The way to do this depends on your web server, hosting company, and so on.

If you’d like to know how to use the free Let’s Encrypt service, check out Mikey’s post:

100% HTTPS in the internet? Non-Profit makes it possible!

Otherwise, check with your hosting company or web server documentation.

If you’re using cPanel / WHM, you can quickly and painlessly buy and install an SSL certificate for as little as $9 a month… soon to be free with the AutoSSL feature in WHM!

Configure WordPress to use HTTPS

This part is the easiest:

  1. Log in to your WordPress Dashboard
  2. Go to: Settings -> General
  3. Change the two fields WordPress Address (URL) and Site Address (URL) so that both have your site’s URL, but with https:// now

WordPress General Settings - Site Address

Fix Mixed Content error messages on your site

When you load your web site up via HTTPS, you’re probably going to see the “broken padlock” symbol next to the URL in the address bar.

Usually, you can click on this Broken Padlock and your browser will tell you what images or other resources are being loaded over HTTP instead of HTTPS.

Keep in mind that when a site uses HTTPS, everything on the page must load with HTTPS, including IFRAME URLs!!

Otherwise, your connection to the server is not totally secure.

The most obvious culprit for this issue is images!

Prepare to fall off your chair, but as it turns out, WordPress stores image tags in article content with full URLs – including protocol and domain name. Don’t ask me why…

Take a look at an image tag extracted from one of my articles:

I can't log out of Windows 10!

Notice that both the SRC= and SRCSET= attributes contain “https://scottiestech.info”. If they used http://, it would “break” SSL.

How to fix images on your site? Easy! You just run a mysql query (using phpmyadmin or whatever):

UPDATE wp_XXXXXX_posts SET post_content = ( Replace (post_content, 'http://YOURSITE.COM/wp-content/uploads/', 'https://YOURSITE.COM/wp-content/uploads/') ) WHERE Instr(post_content, 'http://YOURSITE.COM/wp-content/uploads/') > 0;

Obviously, change the above SQL statement so that it uses the real name of your posts table, and the name of your site instead of YOURSITE.COM.

Now, all the image tags in your articles will have HTTPS URLs.

Don’t ask me why WP couldn’t just use relative URLs like the rest of the world… but whatever!

Widgets and other page chunks

You may have “insecure content” (loaded via HTTP://) in your sidebar or other widgets.

To fix these, you’ll have to know where to fix the code.

Usually, you just go to Appearance -> Widgets in the WordPress Dashboard, and edit any images or other content in your included widgets so that they also use “https://”.

Fun with Plugins

Next, you may be using certain plugins that make their own copy of your WordPress Address from General Settings. This copy will still use HTTP instead of HTTPS, so you’ll need to change them.

The absolute easiest way to fix this? Disable the plugin, and then re-enable it. DONE!

Repeat for any plugins that cause problems… Or just do it for all your plugins to make sure. Normally, you won’t lose any configuration settings.

Enable “SSL Everywhere” redirect

Finally, you might want all HTTP URLs to automagically redirect to HTTPS.

You can do this fairly easily using the following examples:

Apache

Add this to the .htaccess file in the root of your site inside the IfModule mod_rewrite.c block:

  RewriteEngine On
  RewriteBase /
  # Redirect to SSL always
  RewriteCond %{HTTPS} !=on
  RewriteRule ^/?(.*) https://%{SERVER_NAME}/$1 [R,L]
  # BONUS: Remove www
  # RewriteCond %{HTTP_HOST} ^www\.(.*) [NC]
  # RewriteRule ^(.*) https://%1/$1 [R=301,L]

nginx

Add this to your nginx site conf:

server {
  listen 80 default_server;
  listen [::]:80 default_server;
  server_name _;
  return 301 https://$host$request_uri;
}

Wasn’t that easy?

No, not really.

I’m actually kind of surprised that converting a WP site to use SSL is so dang complicated.

There are plugins available to automate a lot of this, but it’s really not something that should NEED a plugin.

Hopefully, future versions of WordPress will handle SSL a bit more elegantly.

Until then, at least you’ve got some tricks to get going!

Computers, Networking , , , ,

Shortlink:

  1. August 7th, 2016 at 20:13 | #1

    Hey Scott, do you know if changing to SSl and using the htaccess file to redirect affects the SEO rankings at all?

    • August 7th, 2016 at 20:38 | #2

      Supposedly, your ranking will go up with full SSL. Google seems to favor it now.

      Google Analytics also seems to have no trouble realizing that a url with HTTPS is the same as the HTTP one.

  1. No trackbacks yet.