How to Switch to HTTPS – The Ultimate Guide for WordPress Non-Coders

You might already know: Google are on a mission to get ALL websites on the internet onto SSL.

They’re gradually rolling out more and more ways to force you to make your websites secure. Fairly soon they’ll display warnings on ALL websites in Chrome that aren’t HTTPS.

Now you don’t want yours or your clients websites flashing up scary ‘Not Secure’ warnings to visitors. That is definitely bad for business!

So the upshot is: if you haven’t already, you need to switch your WordPress websites to SSL.

And in this video, especially aimed at you as a non-coder, I’m going to show you exactly how to make the switch as easily as possible. I’ll also show you how to avoid all the various potential pitfalls that trip so many people up—don’t get tripped up!

Watch the video:

Looking for links to the resources I mention? Check them out here.

---

Pssst! Make this SUPER easy…

---

The problems, the pitfalls

Now switching to SSL is easier and waaay cheaper than it used to be – in fact, it’s now free! – but it’s a process that you still need to be really careful of.

Problems I see all the time include:

• You make the switch and still not see the secure padlock. I’ll show you how to avoid that.
• You lose a site’s search engine rankings if you don’t handle the switchover properly – bad times. We’ll make sure that doesn’t happen.
• You lose all your social counts if you have those on your site, which will definitely damage your ego if nothing else.
• Also people often forget to update really crucial external services, not realising till it’s too late.

Here’s what’s coming up…

• I’ll quickly explain what SSL is and why it’s a really good idea for your sites to be on HTTPS.
• I’ll tell you what Google are doing to force you to make the switch.
• I’ll show you exactly how to switch your WordPress sites from HTTP to HTTPS, really easily—avoiding all the typical gotchas.

This will all be aimed at you as a non-coder using WordPress with tools like the Elementor page builder.

What is SSL?

SSL stands for Secure Sockets Layer…. but all you need to know is that if a web page is using SSL then when you visit it, it’s https in the address bar, not http, and you see a nice padlock. This gives visitors to your sites that warm fuzzy feeling of safety.

If a page is using SSL—meaning its URL starts with https—then all data coming to and from your site is encrypted: not just passwords and credit card details but all the content and code.

Now there are loads of good reasons to have your entire website on SSL, even if you’re not transferring sensitive data.

And I’m not talking just because Mr Google is telling you to do so… although that is quite a kick up the jacksie to get on with it, I have to admit…

Why is SSL such a great idea?

SSL has everything going for it:

• Data transferred to and from your site can’t be intercepted or modified. For example, when you login to WordPress, your username and password is normally just sent as plain text that anyone can read if they want to. That’s not good is it?
• SSL provides a huge level of trust and credibility in your website generally – visitors see that padlock and have a better user experience because of it.
• And a very big reason is performance – if your site uses SSL then it automatically runs on HTTP/2, if your host supports it. I won’t go into what HTTP/2 is in this video, but just know that it’s waaaay faster than boring old HTTP/1. Sites not on SSL simply can’t use HTTP/2 at all, meaning you lose out on a lot of page load speed benefits.

Google mean business

So Google are out to make sure ALL websites – yes, including yours – are on SSL as soon as possible.

It started in 2014, when they announced that secure sites would have a bit of a rankings boost. Even back then, they said their intention was to have HTTPS “everywhere” as soon as possible.

Starting in October 2017, any pages containing form fields trigger a ‘not secure’ warning, and not just password or credit card fields.

We’re talking things like search boxes and blog comment forms, or asking for your name in a support form, things like that.

Now this is just in Google Chrome, but seeing as Chrome is used by nearly 60% of web users (October 2017)… that’s a big big deal.

And pretty soon, likely in 2018, they’ll eventually show ‘Not Secure’ on all HTTP pages.

So even if you have no forms on your pages, your website could still be flagged as unsafe on the Chrome browser.

Ouch.

How to switch a WordPress site to HTTPS

Now of course the easiest solution in future is: start every single site you build on SSL, right from the start. Even when you’re developing a site that’s not live yet, you can still be on SSL.

A local development tool like Local by Flywheel, which I love, allows you to have your local WordPress sites on your own computer as HTTPS, which means it’s really straightforward when you migrate the site to the live domain on HTTPS too.

But here I’m showing you how to switch from an existing HTTP site. So if you haven’t switched already – you need to. And ASAP.

To start with, here’s an overview of what we’re going to do:

1. Acquire and install a free SSL certificate, so your site can run on HTTPS.
2. Switch WP to use HTTPS and redirect all the old HTTP pages to your shiny new secure HTTPS versions instead.
3. Update any hard-coded links to the old HTTP pages that are in your content, blog posts, pages.
4. Fix the dreaded ‘mixed content’ issue that stops your lovely new secure site having a padlock in the address bar.
5. Fix the settings in your CDN, if you’re using one. Don’t worry if you’re not.
6. Fix problems with external services, like social counts, Google Analytics, Google Search Console, things like that.

Don’t rush switching a site to SSL. You need to leave plenty of time to make sure you’ve done it right and covered all the steps.

Free checklist!

I’ve actually made the switch process easier for you by making a handy checklist for you to follow! I know, I’m too good to you.

Alright… lots to cover. Let’s crack on.

1. Acquire and install an SSL certificate for your domain

For your site to use SSL, it needs an SSL certificate.

It used to be that if you wanted your site on SSL you had to pay for an SSL certificate for at least $100 or so a year. You can still pay for a certificate if you want to, but the easiest and free way these days – we all love free – is via a service called Let’s Encrypt.

Let’s Encrypt provide free SSL certificates, in an aim to remove any excuses for making your sites secure.

You get your free certificate via your host’s control panel, so your host has to actually support Let’s Encrypt. You can’t set it up yourself.

2 of my favourite hosts support it: SiteGround and Flywheel. It’s likely your hosting company does too.

As an example, SiteGround use cPanel, like many many other hosting companies, so you should just be able to login to your cPanel, go to Let’s Encrypt, and follow the instructions. Just choose the domain you want from the list.

Flywheel have their own beautiful custom control panel, so you can easily get your SSL certificate for your domain here.

If your host doesn’t support Let’s Encrypt? Ask them. One of my clients asked his hosting company to sort it out for him, and they did, even though they don’t advertise support for Let’s Encrypt yet.

That should now have your SSL certificate installed for your domain, which means you can actually visit your pages with HTTPS on the front of them now.

But… that’s just the start of it.

2. Switch WP to HTTPS and redirect everything to HTTPS

We now need to tell WordPress the site is now on HTTPS, and also redirect the old HTTP URLs to the shiny new HTTPS versions instead.

This is especially important for search engines like Google. If you don’t do this bit right, they won’t understand that all your site’s URLs have now changed, which can cause big issues with your search engine rankings.

Note: we’re not making a copy of the site to a whole new separate version or anything. The site is still in exactly the same place.

Before we do anything else, there are 3 things you need to take care of:

1. Clear any caches you might have running with caching software, then deactivate any caching plugins, or caching you have on the server. You can turn it back on once this is all completed.
2. If you use a CDN, like KeyCDN or Cloudflare, I’d advise for now turning your CDN off on your site for now, as that’s a separate issue I’ll come to later. And then….
3. Take a backup! I use UpdraftPlus to backup my WordPress sites, but whatever you use, backup, backup, BACKUP!

You’ve taken a backup, right?

Ok, there are a few ways of achieving this step, if you’re a non-coder and aren’t comfortable messing about on the server.

Option 1: If your host has a ‘Force SSL’ option

First, if you’re with a host that has a ‘Force SSL’ option, it’s best to use that option.

For example, SiteGround have a plugin called SG Optimizer, and within that there’s an option to force HTTPS. Just click that and your website traffic is redirected to a secure HTTPS connection.

You might also have to go to Settings > General in WordPress and change both your URL settings here to HTTPS. But if that’s already sorted, then great!

If you’re on Flywheel, they have a force SSL option too. This also redirects all traffic to the new HTTPS version at the server level, which is perfect.

Again, check in Settings > General and change both URLs to HTTPS.

If they’re greyed out and you can’t change them, get in touch with Flywheel support and ask them – don’t worry though, everything will still be working properly. They do the redirects before the settings stage anyway.

Check with your own host to see if they have a similar option to force SSL.

Just beware: if your site is loading in content that’s not secure – meaning there are links in your code or content that are referencing insecure HTTP URLs still, like images or adverts – then that content won’t load anymore, so you might have disappearing images, for example. We’ll fix that next.

Option 2: If your host does NOT have a ‘Force SSL’ option

For now though, if your host doesn’t offer a force SSL option, then you have to use a WordPress plugin instead.

If that’s you, then simply install and activate the Really Simple SSL plugin. This also changes your WordPress site URL settings and redirects old HTTP URLs to the new HTTPS ones. It also does some clever checks on how your server’s set up so it sets things up the best way for you.

Just don’t install Really Simple SSL if you’ve turned on a Force SSL option in your hosting control panel or in a plugin provided by your hosting company.

You don’t want 2 lots of redirects happening at the same time.

3. Update hard-coded HTTP links

There’s a small problem with how we’ve done things so far. The ‘Force SSL’ solutions (from either your hosting or the Really Simple SSL plugin) only actually do the rewrites ‘on the fly’. The actual URLs in the database still remain as the old HTTP ones.

So for example, any hardcoded links or images in your content will still be the old HTTP.

It’s not a problem as such – your site is still on SSL, those links do get redirected – but it’s much better to change the actual URLs in the database to the new HTTPS versions too, not just redirect them.

Redirecting them all the time is slower and prone to problems in future.

So the answer is to run the Better Search Replace plugin.

Once it’s installed, the settings are under Tools > Better Search Replace.

Put the old home page URL in the first box – I’ll pretend my old URL was http://www.example.com. That’s it. No forward slashes on the end.

Then in ‘Replace With‘, I’ll put the new HTTPS version. I’ll actually copy the first one, and then stick an S on the end. That’s it. Copy and pasting just avoids you making any silly typos.

Select all the tables in the database. Leave the case-insensitive and replace GUIDs boxes unchecked. You can do a dry run first which just simulates the find-and-replace, or untick it to do the actual run.

That will now change all mentions of the old HTTP URLs in the entire database to the new HTTPS ones. That’s much better, and it’ll fix a lot of mixed content issues which we’ll come to shortly.

Do you use Elementor?

If you use Elementor, there’s another very important task, in a similar vein.

Come to Elementor > Tools, then the ‘Replace URL’ tab.

Then in ‘Update Site Address’—the same as with the Better Search Replace plugin—pop your old HTTP address here and your new HTTPS version in. Copy and paste it in and then just add an S, to avoid any problems with typos.

This is essential: you will very likely get mixed content warnings otherwise, or things like missing images in Elementor, as well as other potential problems too.

4. Fix mixed content errors

If at this point you visit the pages on your site and the padlock is on – congratulations! Pour yourself a celebratory beverage and take the rest of the day off.

Tell your boss I said it was ok – you’ve earned it!

However, if you find you don’t have the padlock yet, or… you have missing or broken content on your pages, like missing images… then my friend, you likely have mixed content problems.

This basically means that, while your site is trying its best to be all secure, in your site’s source code you’re still calling in maybe images, CSS or javascript using an HTTP link, not HTTPS.

And because your page is calling in insecure content…. you don’t win the padlock prize. 🙁

So examples of this might be links to background images in CSS files, links to outdated scripts, links pulling in adverts from a different server, etc.

Here’s how to fix it:

• Go to Why No Padlock and pop your site’s URL in the box. It’ll tell you what the problem is on your page, so you can try to fix it.
• An alternative is this SSL checker from JitBit which actually crawls up to 200 pages on your site and then reports on what’s causing the mixed content problem.
• And finally you can also try installing the SSL Insecure Content Fixer plugin, which helps find and fix these issues too.

And if you can’t fix it yourself, especially if you’re not very techy – sometimes it’s best to just hire in some help to get the job done.

At this stage, once you’re happy all is well, you can turn any caching plugins back on, if you have them.

5. CDN

This next stage only applies to you if you use a CDN, or Content Delivery Network.

The upshot is: your CDN URL must also be HTTPS too.

For example, I use KeyCDN. So when I switched my site to SSL, I had to install a free Let’s Encrypt SSL certificate in my KeyCDN control panel too, so my CDN subdomain URL – https://assets.designbuildweb.co – was also HTTPS.

If you don’t do this, and your CDN URL is still HTTP, then you’ll still have mixed content problems.

Now I don’t know which CDN you’ll be using, so it’s best to check your own CDN’s documentation and find out what you need to do. It’s why I suggested earlier I think it’s best turn the CDN off on your site till you’ve sorted it out.

If you’re using Cloudflare… it can sometimes cause a few other issues you just need to be aware of:

• If you’ve used the Really Simple SSL plugin, then there’s an article from them about Cloudflare you need to read.
• And if you’re on SiteGround, they also have a support article about Cloudflare too.

6. External services

At this point, your site should now be on HTTPS and everyone is happy, including Mr Google.

Always a good idea to keep him happy. 😀

This final stage is an important one though, and one that so many people forget until much later, when they realise that certain things are broken.

You need to make sure that you update any external services you use, and there are a few important ones. Pay attention.

Google Search Console

First job is to sort Google Search Console (or Webmaster Tools as it used to be called) – if you use it, that is, and you really should.

Create a brand new profile for your HTTPS site, separate to your existing HTTP profile.

Resubmit your XML sitemap, if you have one. Remember, your sitemap will now have all your HTTPS URLs in it, not the old HTTP ones. If you’re using an SEO plugin like Yoast or The SEO Framework, they automatically create an XML sitemap for you. Just grab the URL and pop it into Search Console.

Also, if a disavow request was ever submitted for this site, in the existing profile, then you must re-download the existing disavow text file, and then resubmit it to the new HTTPS profile.

If you don’t know what a disavow file is – don’t worry, you can ignore this bit. It’s not something to be proud of.

Once that’s done, you can safely delete the old HTTP profile.

Google Analytics

Next, make sure to login to the Google Analytics account for this site – or whatever analytics package you’re using – and in the settings under Admin, change the site URL from HTTP to HTTPS.

You’ll have one under Property Settings and one under View Settings. You may have several views to change.

Unlike Search Console, you don’t have to create a new analytics profile. Just update and save.

Once you’ve done that, you can now re-connect your Analytics account up to Search Console again, this time to your new HTTPS profile. So go into Property Settings, then scroll down to relink Search Console up here.

I also like to add an annotation to Analytics to note the date the site moved to SSL, so you can spot any issues in future.

Ok, that’s your analytics data sorted.

Recover Social Counts and Comments

If you use a plugin like the brilliant Social Warfare for social media sharing, then you might have social counts like these.

Big problem though: once you move to HTTPS, you’ll lose these counts! Reset to zero across the board – really not great for the old ego!

So you need to actively recover them.

With Social Warfare, to do this you need the Pro version, but it’s very inexpensive and worth every penny.

Then in the plugin settings, under Advanced, you activate share recovery here, and then set your previous connection protocol to http – NOT https.

Then save changes. That’s it.

Also, if you use Disqus for comments, instead of the WordPress comment system, then you’ll also need to recover those. Check out Brian Jackson’s excellent tutorial showing you how to do it.

Update social accounts

Make sure you update the URL to HTTPS in the site’s various social profiles, like Facebook, Twitter, Instagram, YouTube.

Update other external software and tools

And finally, don’t forget to update the site’s URL in the settings in any other external tools the site uses. For example in email marketing systems like MailChimp, split testing tools, keyword rank trackers, etc.

And…. that’s a wrap!

So that’s how to switch a WordPress site over to SSL. It’s not a difficult process really but it’s something you have to take your time over, do it carefully, and not miss any steps.

If you need a handy checklist to follow and make this even easier…

Questions? Thoughts? Was this useful? Let me know in the comments!

The post How to Switch to HTTPS – The Ultimate Guide for WordPress Non-Coders appeared first on Design Build Web.