Guide: Migrating your Blog to SSL

Migrating to SSL has been a big topic recently, but it’s daunting to (a) decide if this is for you and (b) actually set it up. Google has been pushing this initiative by announcing their Chrome browser will show an “Insecure” warning for non-secured sites, causing a mad dash for SSL set-up. Let’s talk about why you may or may not want to add an SSL certificate to your site and, assuming you’re ready to set it up, how to do so yourself.

Why switch to https?

What good is an SSL certificate anyway? This adds a secure layer between your site and your visitors by encrypting data. It protects the information of people browsing your site and sharing their information with you.

What if you don’t like it? Can you undo it? If you decide later that you want to revert your site, you can redirect visitors back to the original http URL, but you’ll need to keep your SSL certificate enabled in order to do so. This shouldn’t be a huge problem since there are more and more free options available, but if your host only has paid options, consider your finances before setting this up.

What’s the worst that can happen? In my opinion, the worst-case-scenario would probably be that your certificate isn’t automatically renewed and visitors coming to your site are unable to access your content until that is noticed & resolved. I believe the best way to avoid this is to work with a host that will set up and automatically renew your SSL certificate for you.

What’s involved in setting this up? Let’s get into this, below! Before we get started, though, I want to address that it’s possible to use a plugin for your SSL set up. I wouldn’t recommend this though, because your site may not work if the plugin doesn’t work… but if you get stuck in this process, try installing one of those plugins (such as Really Simple SSL) and using it until you can get your site fixed up. 🙂

1. Install the SSL certificate

The first step is to obtain a certificate for your site. The best way to do this, by far, is through your host’s support team. SSL certificates need to be installed and renewed and they’re not my area of expertise (or yours!) so I’d highly recommend the support of a good host. A lot of hosts have free SSL options (e.g. Let’s Encrypt), but some will only provide paid ones (e.g. through themselves). Either way, I’d check with their support team to ensure that’s going to be (a) automatically installed and (b) automatically renewed for you. If so, get that set up. If you can change your domain’s http to https and your site successfully loads (rather than showing an ugly warning), it’s installed and ready to go!

2. Update all instances of http to https

Now we’re getting into the risky bits, so let’s start by taking a backup. Our nightmare is that you mess up your URL throughout your site and it stops loading. You could feasibly fix this in your database, but you’d going to be too stressed out to try that, so do yourself a favor and take a backup. Depending on who you’re hosting with, this may be done automatically nightly, so you’ll just need to click “revert” if anything goes wrong.

Now, the easiest way (in my opinion) to replace ALL instances of http is by using a plugin. I like Better Search Replace (https://home/wf2jjja/public_html.org/plugins/better-search-replace/) but Velvet Blues Update URLs (https://home/wf2jjja/public_html.org/plugins/velvet-blues-update-urls/) is an often recommended option, as well. Since you may not have been consistent early-on, replace BOTH of these URLs:

• http://www.your-site.com and
• http://your-site.com

with just ONE of these urls:

• https://www.your-site.com or
• https://your-site.com

Change the WordPress and Site Address to https

If it wasn’t done during the search & replace process, go ahead and navigate to Settings > General > WordPress Address (URL) and Site Address (URL) and update the URL here as well. At this point, you’ll be automatically logged out of WordPress and asked to login anew.

3. Check for insecure content warnings & resolve

Once you can visit your SSL-secured site and the resources have theoretically been automatically updated to use “https,” we can start fixing those “insecure content warnings.” These are basically http resources (such as scripts or images) that are called on an https page. This “mixed content” will prevent your “https” text in the browser’s address bar from turning green – it stays gray. (Sad. :()

This part may feel unfamiliar to you, and therefore difficult, but the changes we’ll make here are fairly low risk. We just want to find any instances of “http” the remain on your page.

To identify these resources, you can use Chrome’s inspector tools to access the “Console” tab and read through the warnings there, which should appear with a light yellow background.

• Open the panel
• Filter the output for items that begin with “Mixed Content”

We need to find how these files are added to our site and update the URL.

There are a few places I frequently see these warnings crop up in:

• Your logo, set within customizer
  Simply use customizer to remove the current logo, then re-select the same image from your media library. This will force the URL to update to your secure one.
• Styles from your style.css file
  If you or your developer hard-coded URLs, these will need to be updated. You can change the “http” to “https,” but sometimes it’s easier to use a relative URL (remove your domain from the beginning, so “https://www.oncecoupled.com/full-url-here/” becomes “/full-url-here/.”
• The subscription form URL
  If you’re using a plugin or widget to manage subscriptions, make sure the “form action” URL starts with “https://” (or leave out the “https:” and just start with “//”).
• Images inserted from an external site
  External images can’t be forced to https because that site may not have an SSL certificate install. Instead, it’s better to upload these images to your site so they can benefit from your own security (added bonus: it’s polite because you’re no longer stealing resources from the other site’s server).

Once you’ve identified the resource, find it within your WordPress install/files and update it. This can be the most time-consuming step because you need to take a set of information and figure out where that’s originally located. Just take your time and remain diligent. 🙂

4. Create http to https redirect

Both your http and https URLs should work at this point, but visitors may be able to access either site, and we want them to go to a single version via a single URL. To do so, we’ll need to set up a redirect from http to https.

There are a few ways to do this, and the best option will depend on your host. Therefore, this is a great point to stop at and ask your host which method they recommend and if they have a help article on this.

• Hosts using nginx servers may not have any options available to you – the only choice is to email their support team and ask them to set up the redirect. This is usually the easiest option, because you don’t have to DIY anything, you just contact support and they let you know when it’s done!
• WordPress managed hosts tend to have some built-in redirect options. WP Engine is one example of this. You’ll use your dashboard to create the redirect. Note that you aren’t setting up a redirect for every URL, just a redirect that takes any “http” URL and adds an “s” to it. With Flywheel, this is as simple as updating your “primary” URL to the https version.
• Most non-managed hosts seem to be running on Apache, though, which gives us an htaccess file. By pasting the following snippet in it, we can set up our https redirect:

After you’ve set up your redirect, give it a try by visiting your site with an http:// address. You should always end up at the https:// version!

At this point, you’ve got SSL set up and the final steps are to polish up your settings. On the other hand, you may be here because your host got you to this point, but you need to do the final steps yourself. Luckily, these are pretty straightforward:

5. Install your Content Security Policy (CSP)

This may be recommended if you’re running ads on your site. For more information, contact your ad network. For instance, here’s Mediavine’s help article on CSPs.

If you’re using a theme with an area for header scripts (such as Genesis > Theme Settings > Header and Footer Scripts > Header Scripts) you can paste the CSP in there and it will work. Otherwise, you can use a plugin such as Insert Headers and Footers.

6. Update Google Analytics URLs

To avoid warnings in Google Analytics, we need to be sure our settings there match the URL we’re sending our visitors to. Make sure you update the URL in Property Settings > Default URL and View Settings > Website’s URL. There’s a drop-down for http/https, so you should just need to change that and click the “save” button at the bottom of the page. If you go back, then re-enter the page, that setting should show the new value.

7. Create the https Google Search Console property and submit new sitemap

In order to continue using Google’s Search Console (and receive relevant insights from it!) you’ll want to create a new property for your https:// URL. There are typically four possible properties, so now is a good time to go ahead and ensure they are all registered and verified. For example, mine are:

• http://www.oncecoupled.com
• https://oncecoupled.com
• http://www.oncecoupled.com
• https://www.oncecoupled.com

I find that the easiest way to verify these is using Google Analytics, but you can use whichever method works best for you.

Once verified, you’re technically ready to go – you could stop here! I like to go ahead and submit a new sitemap, though, so I can give Google a heads up that I’m using a new Search Console property and that my site’s URLs have changed.

Navigate to Crawl > Sitemap to do so. If you use Yoast & have left their sitemap functionality enabled, click the “Add/Test Sitemap” button and put in “sitemap_index.xml,” then press “Submit.”

8. Check share counts

Last, but not least, if you’re using social counts on your site to build social proof, you’ll want to check that those haven’t been lost. Since share counts are specific to the exact URL that has been shared, your http and https counts will not be the same, even though the page they direct visitors to is.

For this part, I’d recommend reaching out to the support team of the plugin or service you’re using, whether that’s Social Warfare, Po.st, ShareThis, AddThis, etc. They likely already have resources they can point you to. 🙂

That’s it!

You’re finally switched over to https… how does it feel?!