🔒 How to easily add SSL and HTTP/2 to your site for free

Written by and published



Google really wants Webmasters and SEOs to make their sites secure and faster. There’s just one problem…it’s not easy to do. Adding an SSL certificate is still expensive and difficult to install. While speeding up a site can be even more complicated and usually requires a lot of coding changes.

In my pursuit to solve this problem, I found a solution that is both easy and free!

Cloudflare offers a free account that provides SSL and HTTP/2. If you haven’t heard of HTTP/2, it’s a new web protocol that makes your site load super fast. While it doesn’t remove the need to optimize your pages, it can still provide a significant improvement with page speed.

Step-by-Step guide to adding HTTP/2 and SSL using Cloudflare

Watch the brief video to get a good idea of how it’s done and then follow the detailed instructions on this post to add HTTP/2 and SSL to your site.

Step 1: Add site to Cloudflare

Go to Cloudflare and Signup for an account if you don’t already have one. Add your site and then wait for it to finish the scan.

Add Site

Step 2: Verify DNS settings

The scan detects your DNS settings and creates entries for them. Make sure you compare these with your current DNS settings. If anything is missing, you’ll need to add it before proceeding.

Verify DNS

Step 3: Choose the Free account

Choose the Free account. That account will give you everything you need to have SSL and HTTP/2 on your site, along with many other useful features. Cloudflare is designed to grow with you, so if you end up needing more advanced features, you can upgrade at any time.

Free Account

Step 4: Change DNS servers

In order for Cloudflare to work, you will need to switch your DNS servers to them. This sounds scary, but it’s not. All you need to do is login to the registrar where your domain is registered and switch out the existing DNS servers with theirs.

Cloudflare DNS

Step 5: Wait until your site is active on Cloudflare

Before you do anything else, you’ll need to wait until your domain is active on Cloudflare.

Active Site

After your domain is active, you’ll then need to wait for your Flexible SSL certificate in the Crypto section to become active. Once it’s active, proceed to the next step.

Active Certificate

Step 6: Configure your SSL settings

Important: It’s recommended that you wait 24 hours before proceeding, because your site may be temporarily offline to visitors if you don’t. However, if your site is using WordPress, you should go ahead and install and activate the Cloudflare Flexible SSL plugin. If you don’t do this, you may have difficulty accessing your site after you complete this step. Also, this is the only thing you need to change for now. For example, in General Settings DO NOT update the WordPress or Site Address to use https or add an http to https redirect in your .htaccess file. Once your site is active on Cloudflare and you’re able to access your site using https, you can proceed.

Even though your site now supports a secure connection, http still works too. The ideal configuration for SSL and SEO is to have all http URLs redirect and use https. To force the use of https go to Page Rules.

Page Rules

Add a new page rule and enter your domain with http and a slash with an asterisk at the end of it. Then choose Always Use HTTPS and Save and Deploy.

Always SSL

Important: If your site is using WordPress, you will want to update the WordPress and Site Address to use https. This will make dynamic links and new media files use https instead of http. Do not add an SSL redirect to your .htaccess file.

If you have assets (CSS, JS, images, etc…) that are linked with http, you will need to do one or both of the following.

Make internal asset links reference the root and external asset links be relative to the site’s protocol. You can do that for internal links by removing the protocol and domain, and using a single slash. For external links, remove the protocol, but keep the two slashes.

/css/main.css
//externalsite.com/js/jquery.js

If you use WordPress, then all of the images on posts and pages will most likely be linked with http. The quickest way to change the http to https or make them relative (recommended) is to use the Better Search Replace Pro plugin.

Turn on “Automatic HTTPS Rewrites” in Cloudflare

In addition or alternatively, you can turn on Automatic HTTPS Rewrites in Cloudflare. That will rewrite any asset links that are using http to use https.

Enable SSL Rewrites

Update Google Search Console and Analytics

That’s it! You now have SSL and HTTP/2 working on your site. Once you verify everything is working correctly, you can add the https version of your site to Google Search Console and remove the http version.

Update: Jeremy Rivera, a Nashville-based SEO that I know and trust, suggests you keep your http property on Search Console until Google fully switches your indexed results to https. This is especially true if you don’t want to lose your historical data.

You will also want to change your Google Analytics settings to https too.

Update GA

Bonus: Cloudflare with WP Rocket

My favorite WordPress caching plugin is WP Rocket. Not only is it reliable and easy to use, it also supports Cloudflare. If you’re using WP Rocket, follow these simple steps to enable it.

Step 1: Enable Cloudflare

To enable Cloudflare in WP Rocket, go to the Settings and click on the CDN tab. Check the Cloudflare option and then save the settings.

Enable Cloudflare

Step 2: Get Global API Key from Cloudflare

Login to Cloudflare and go to your account settings page to retrieve your Global API Key.

Cloudflare API

Step 3: Enter Global API Key and configure WP Rocket

Enter your Cloudflare email and Global API Key. Select your site and make any other changes to the settings that you would like.

Cloudflare Settings

Now you have the best of both worlds, WP Rocket and Cloudflare on WordPress!

  • chrismccreery

    With this SSL, are you able to use it for payment gateways that require SSL (Stripe)?

    • Stripe (typically) uses a modal and also uses their own secure server for transactions, so having or not having SSL on your own site shouldn’t be an issue. With that being said, it’s SSL, so if you have a form on your site for taking personal information, it should be encrypted.

    • Watch the brief video to get a good idea of how it’s done and then follow the detailed instructions on this post to add HTTP/2 and SSL to your site.

      • Watch the brief video to get a good idea of how it’s done and then follow the detailed instructions on this post to add HTTP/2 and SSL to your site.

  • Spider Sauce

    Thank you. This was very helpful. The whole switch to https thing is quite scary – especially when searches bring up the likes of WIRED who took months to get it squared away. This is great and simple tutorial and I am sure I’ll be sending people to it for a long time to come.

    • That’s great to hear and I’m glad you think it’s simple, because it’s supposed to be.

  • Aaron Rudd

    Thanks @jonhenshaw:disqus !
    Very helpful as always.

  • Do you think there is any difference or benefit between Cloudfare and Let’s Encrypt?

    • There’s a huge difference! One is easy and effortless to install and the other one is not. Hint: my way is the easy and effortless one 🙂

  • Garnet

    made the switch on a site to try it out, worked well but now cannot connect via ftp on using filezilla…off looking for a solution…

    • Interesting and sorry to hear that happened. Have you tried FTPing with the IP address? Also, many hosting providers have a general domain you can use to access your server, whereas accessing via your domain is typically a secondary way to connect to it.

      • RyanMJones

        Cloudflare usually sets up a direct.yoursite.com subdomain and/or http://ftp.yoursite.com thats set up for FTP

      • Add a new page rule and enter your domain with http and a slash with an asterisk at the end of it. Then choose Always Use HTTPS and Save and Deploy.

  • Thank you for this excellent guide! I am trying it on one of my sites now, and have have one question: how can I “Turn on ‘Automatic HTTPS Rewrites’ in Cloudflare”? Cloudflare only seems to allow a single rule per URL, and since I’ve already used created a rule for http://domain.tld/* (“Always Use HTTPS”), it won’t let me create a second rule for http://domain.tld/* and select “Automatic HTTPS Rewrites.” Is there a way around that? Or am I just doing it wrong? In any case, thanks again!

  • Excellent work, as always, Jon. Since Cloudflare is a CDN, would creating an account with them just be an additional layer on top of my current hosting? Also, I really don’t need to purchase an SSL certificate? (Yes, I read their documentation on both counts but I’m still a little incredulous. This is a lot of good stuff to be offering for free.) Thanks!

    • Thanks @disqus_rRkdkyE6cN:disqus! I have sites that use Cloudfront and other sites that host everything locally. Cloudflare plays well with either. In fact, I’ve read some articles that suggest using a CDN like Cloudfront is still recommended and works well with Cloudflare. The same is true for caching plugins like WP Rocket, which is what I use for all of my WordPress sites. Regarding SSL, you do not need a certificate, but it’s okay if you already have one. If you don’t have one, Cloudflare will use something they call “Flexible SSL” which makes the connection secure to the visitor, but the connection between Cloudflare and your site remains insecure (via http). Alternatively, if you already have an SSL certificate, they use something called “Full SSL”. You’re good either way, but what’s important is that you don’t need SSL on your host if you don’t already have it.

      • Thanks for the details. I’ve been looking at getting a certificate for one of my sites; more for the practice, since my blog doesn’t collect any data and doesn’t really need to be secure (IMHO). But this would save me a few bucks AND it’ll probably be a solid recommendation for friends and/or smaller clients. Cheers!

  • Mike Belasco

    Jon,
    Great article. Was just talking about this with my team. Have you tried turning on HSTS and submitting to the preload list? I can’t get it recognize HSTS is on even though I configured it in CF. https://hstspreload.org/

  • Christina

    Hi @jonhenshaw:disqus, great article. I’ve been wanting to implement it on a couple of sites for a few weeks now. Having it setup like this, is there any SEO issues with duplicate content with serving http and https traffic?

    • Thanks @charris42:disqus. As long as you add the Page Rule I included in this tutorial, you shouldn’t have any http traffic. All of your http traffic will automatically be redirected to https.

  • justaguy

    There’s a problem with Cloudflare’s SSL on older browsers or OS.

    I have a site where about 40% of people visiting it uses WinXP. And when I switched to Cloudflare I received a large number of complaints that the site stopped working.
    Also one of my friends tried visiting the site with Android 4.1.2 and it didn’t work either.

    Any suggestions?

  • Akki Srinu

    I’ve had the problem after doing this it showing SORRY!
    If you are the owner of this website, please contact your hosting provider
    please help mee