How to setup Cloudflare on your site

Cloudflare is a company that provides web performance and security services, and is completely free for most users

To make it very simple, imagine that instead of linking your domain name to your website, you link your domain to a third-party service (in our case, Cloudflare), which then redirects all your traffic to your website.

Not only it makes your website faster (because the Cloudflare network is available on hundreds of locations all around the globe), but it can also protect your website from attackers.

If you’re not familiar with Cloudflare, here’s a quick list of some benefits you’ll get:

• CDN — Cloudflare’s content delivery network helps speed up your site by serving your static content from a huge network of global servers. Cloudflare is the most popular free CDN service.
• SSL — if your site doesn’t already have an SSL certificate, Cloudflare can help you use HTTPS on your site to get the green padlock in visitors’ browsers
• DNS — Cloudflare is one of the fastest DNS providers, which can speed up your site’s time to first byte (TTFB)
• DDoS protection — Cloudflare can help you protect against distributed denial of service (DDoS) attacks. It can also help you just generally filter out malicious traffic
• Other performance benefits — Cloudflare can help you minify your code, enable Brotli compression, and implement other performance best practices

1. Cloudflare setup

For my example, I’ll use a WordPress blog, which is already working with my custom domain name: example-blog.ml. You can follow the exact same steps with your own domain.

First, create a Cloudflare account. As soon as you have signed up, Cloudflare will start the installation process.

Enter your website domain, then choose the free plan (on the bottom). The free plan is more than enough for most website owners, including me.

Cloudflare will now perform a quick scan to detect your current domain configuration. Accept the recommended settings (unless you know what you’re doing), and click on Continue.

In order to use the Cloudflare proxy your on a domain or a subdomain, you must have the orange cloud in the “Proxy status” column. In the screenshot below, all the traffic on example-blog.ml and www.example-blog.com will go through the Cloudflare network

In order to finish the installation, Cloudflare will now give you clear instructions about what to do from your registrar account (where you bought your domain name!)

In my case, I log into my registrar account, look for the DNS / nameservers settings, and change them as I’m told. Please note that the user interface may be completely different in your case because we probably don’t have the same registrar.

2. Waiting!

After the setup is finished, there is one last step: waiting. DNS is a complex matter and there are lots of cache levels, so be patient. You probably need to wait only a few minutes, but in some cases, it can be several hours.

To know if the installation process is finished, refresh the “Overview” tab of your Cloudflare dashboard. If you still see the setup instructions, wait a little bit more. If the installation is finished, you’ll see the following message

Please note that even after you see this message, you may have to wait a little bit more until your visitors (including you) are actually passing through the Cloudflare network.

To confirm that Cloudflare is effectively protecting your site, go to:

https://[your-domain]/cdn-cgi/trace using your web browser. In my example: https://example-blog.ml/cdn-cgi/trace

• If you see a black text with your domain in the second line, you’re done!
• If you see a 404 Not found error, a ERR_SSL_PROTOCOL_ERROR, or any other result, wait a little bit more. DNS propagation can take up to 24 hours.
• If you see a ERR_TOO_MANY_REDIRECTS, you just need to change a setting in your Cloudflare dashboard. Follow this short guide to fix it.

3. Next steps

Now that Cloudflare runs on your site, you can add a login form on all pages you want to protect using Octauthent.

Password protection made easy

I’ve made another step-by-step tutorial to explain this part, but the steps are really basic:

1. Sign up to Octauthent
2. Create a new site, choose one or multiple user/password combos
3. Go the install tab and follow the instructions

Here is the tutorial if you need more details:

How to password-protect your website with Octauthent

Have a good day 👋