How to set up Cloudflare Free CDN in WordPress (step by step)

Cloudflare is one of the best WordPress CDN services available on the market. They provide a free CDN that accelerates your website, along with a package of powerful security features for small business websites.
How to Set Up Cloudflare Free CDN in WordPress (Step by Step)

How to set Up Cloudflare Free CDN in WordPress (step by step)

Content

Would you like to use the free Cloudflare CDN on your WordPress site?

Cloudflare is one of the best WordPress CDN services available on the market. They provide a free CDN that accelerates your website, along with a package of powerful security features for small business websites.

The challenge is that many beginners might find it difficult to set up Cloudflare, which prevents them from leveraging its benefits.

In this guide, we will walk you through the complete setup of Cloudflare in WordPress to help you enhance the speed of your website.

 

How to Set Up Cloudflare Free CDN in WordPress (Step by Step)

What is CDN?

CDN, or Content Delivery Network, is a system of distributed servers that helps deliver your website files faster to users based on their geographical location. 

Typically, your web hosting service serves your website visitors from one location. All users access the same server, regardless of where they are located. 

This can cause a delay in content delivery for users living farther from your website’s central hosting server. 

That’s why CDNs set up multiple end servers in different locations worldwide. 

These CDN servers cache static content from your website’s original server and present it to users when they visit your WordPress website. 

When there’s a user request, the CDN server closest to the user’s location will handle it. 

What is CDN?

For example, if someone in the USA wants to access a website hosted in the United Kingdom, then a CDN server in the USA will handle that request, not the main server in the United Kingdom. 

With CDN, all user requests are processed by the nearest CDN servers. This reduces the physical distance between visitors and your website’s server. 

As a result, CDN improves the performance and speed of your website for all users, regardless of their geographical location.

A faster website also enhances user experience and can give your website a slight boost in SEO ranking. Using CDN also reduces the load on your main server, protecting it from crashes during traffic peaks. 

If you want to learn more, check out our guide on why you need a CDN for your WordPress blog.

What is Cloudflare CDN?

What is Cloudflare CDN?

Cloudflare is one of the most popular free CDN providers available on the internet. It is a large network of globally distributed servers that automatically cache static content and deliver dynamic content quickly.

In addition to the CDN service, Cloudflare also functions as a cloud-based website firewall and a distributed proxy server. It monitors all incoming traffic to your website and blocks suspicious traffic even before it reaches your server.

They offer a free basic plan suitable for small business websites and blogs. They also provide paid plans starting at $20 per month.

Cloudflare is an excellent choice for small businesses looking for a free CDN. However, if you want to fully utilise all of Cloudflare’s features, you will need a business plan, which costs $200 per month.

Note: We do not use Cloudflare on WPBeginner. Instead, we use Sucuri as a website firewall and CDN. This firewall has the dual benefit of improving speed and security. You can learn more in our Sucuri vs. Cloudflare comparison.

Setting up Cloudflare CDN in WordPress

To get started, you need to visit the Cloudflare website and click on the “Sign Up” button.

Setting up Cloudflare CDN in WordPress

On the next page, you need to enter your email address and password to create an account on Cloudflare.

Simply enter the required information, and then click the “Sign Up” button.

registration in cloudfare

Once you’ve completed the registration, you’ll see a thank-you page confirming that your Cloudflare account is set up.

The next step is to add your website to Cloudflare. You should click on the “Add a Website or Application” button to begin.

Cloudflare add to site

Now you can enter your website in the “Enter your site” field.

Make sure to enter only your domain name, such as example.com. There is no need to enter the full URL or additional characters.

add a domain in cloudflare

On the next screen, you will be prompted to choose the type of Cloudflare plan you want.

For this tutorial, we will choose the free Cloudflare plan. Then click on the “Continue” button.

cloudflare free account selection

Next, Cloudflare will show you a list of all DNS records found by their systems. This includes your subdomains.

DNS records that you want to pass through Cloudflare should have an orange cloud icon. DNS records that will bypass Cloudflare will have a gray cloud icon.

You should review the list to make sure your main domain is active in Cloudflare with an orange cloud icon. Simply click on the “Proxy status” toggle to change the status.

DNS management

After checking your DNS records, just click on the “Continue” button at the bottom.

During the next step of your setup, Cloudflare will ask you to update your name servers. You will be prompted to change your name servers and point them to Cloudflare’s name servers.

managing nameservers in cloudflare

Note: Changing name servers may take some time to propagate across the internet. During this time, your website may become inaccessible to some users.

You can change name servers from your domain registrar account, such as Domain.com.

Or, if you’ve got a free domain from your web hosting provider like Bluehost, then you will need to change name servers by logging into your hosting account.

For the purpose of this tutorial, we will show you how to change name servers from the Bluehost control panel.

Although the process is similar with all hosting companies, you can always ask your hosting provider for detailed instructions for their control panel.

Once you log into the Bluehost cPanel dashboard, go to the “Domains” section and select your domain name. Then click on the “Name Servers” section and the “Edit” button.

dashboard

Next, you need to choose “Custom” and enter the name servers provided by Cloudflare. 

Then click the “Save” button.

Cloudflare save settings

After that, you need to go back to the Cloudflare setup page and click on the “Done, check nameservers” button to complete the setup. 

Now, it will automatically check your new name servers.

Cloudflare automatically checks name servers

That’s it! It will take a few minutes to update your domain name servers and activate Cloudflare.

Once activated, you will see the success message in the Cloudflare dashboard.

Cloudflare complete setup view

Meanwhile, the Cloudflare Quick Start Guide will open automatically, and you can use it to customise your Cloudflare settings. We’ll show you how in the next section. 

Note: The screenshots above show the Bluehost control panel. Your name server settings may look different if you use another hosting provider. 

Configuring Cloudflare with the quick start guide

setup Brotli compresses

The Cloudflare Quick Start Guide should open automatically after clicking the “Done, check nameservers” button above. This setup wizard will help you enhance the security and performance of your website. 

The first setup is “Automatic HTTPS Rewrites.”

Quick settings Automatic HTTPS rewrite

This will help you avoid the mixed content error in WordPress. It does so by automatically changing ‘http’ to ‘https’ in the URLs of all resources and links on your site that can be served with a secure ‘https’ URL. 

This setting is enabled by default. We recommend leaving it enabled and clicking the “Save” button. 

The next setting is “Always Use HTTPS.”

Cloudflare HTTPS usage

Some users report issues when using this setting with Cloudflare. This setting is disabled by default, and we recommend leaving it that way. Later in this article, we’ll show you how to redirect from HTTP to HTTPS using the All in One SEO plugin. 

Now you can click the “Save” button to move on to the next  option. 

The next setting is Brotli Compression. 

setup Brotli compresses

Cloudflare can use Brotli compression to unlock 15-20% speed improvements. This setting is enabled by default, and we recommend leaving it enabled. 

Make sure to click the “Save” button to save this setting. 

Now, you’ll see a summary of what you’ve configured with the Quick Start Guide. 

configure

You should see:

  • Automatic HTTPS Rewrites: ON
  • Always Use HTTPS: OFF
  • Brotli: ON

You have completed the Quick Start Guide, and you can click the “Finish” button. However, there are still some additional important settings that need to be configured.

Configuring additional important Cloudflare settings

Your basic Cloudflare setup is complete, but there are a few key settings you should configure to keep your WordPress site secure.

1. Secure your WordPress login page

You can set up page rules to customise how Cloudflare works on specific pages of your site. This is especially useful for securing critical pages like the login page and the wp-admin area. 

The free Cloudflare account allows you to set up rules for 3 pages. If you want to add more page rules, you’ll need to pay $5 per month for 5 additional rules. 

Click on the “Rules” option in the left menu of the page. Click on the “Create Page Rule” button. 

Secure your WordPress login page

Now, you can set up 3 different page rules. Start by creating a rule that protects your WordPress login page. 

  • Add the following settings to protect your website:
  • Page URL: example.com/wp-login.php*
  • Settings: Security Level – High

set rules for the page

Once you’re ready, click “Save and Deploy” to save and activate the rule. 

 

2. Bypass the WordPress admin panel from Cloudflare Cache

You’ll be returned to the Page Rules page, where you can see your first rule in the list.

Now, you can create a second rule to exclude the WordPress admin panel from Cloudflare caching and activate a high level of security.

Shutdown WordPress Dashboard from Cloudflare

Click on the “Create a new rule” button to create your second rule.

Then, enter the following settings in the rule. You can click on the “+ Add a setting” button to add new rows for additional settings:

  • Page URL: example.com/wp-admin*
  • Settings: Security Level – High
  • Cache Level – Bypass
  • Disable Performance
  • Disable Apps
 

Add setting in Cloudflare

Once you’re ready, don’t forget to click “Save and Deploy” to add the new rule.

3. Configure SSL certificate settings

Another important setting is the SSL certificate, which can be found in the “SSL/TLS” menu on the left.

setting is the SSL certificate

Don’t forget to click the “Full” option if you are already using SSL. 

If you don’t have an SSL certificate, refer to our guide on how to get a free SSL certificate for your website. 

Once you’re ready, Cloudflare will provide the main green padlock in your visitors’ address bar, indicating that your website is secure. 

4. Redirect from HTTP to HTTPS using All in One SEO

As mentioned earlier, we don’t recommend using the “Always Use HTTPS” feature in Cloudflare. A great alternative is to use the All in One SEO plugin. This is the best SEO plugin for WordPress, used by over 3 million websites. 

First, activate and install the All in One SEO plugin. For more details, see our guide on how to install a WordPress plugin. 

Then, open All in One SEO » General Settings and enter your license key in the “License Key” field and click on “Connect.” 

All in One SEO

You can find your license key in your All in One SEO website account profile.

Next, open All in One SEO » Redirects and then click on the navigation option in the “Full Site Redirects” menu.

All in One SEO Redirects

Scroll down until you find the “Canonical Settings” toggle switch. Click on this switch to turn it blue.

Then, turn on the “Redirect from HTTP to HTTPS” switch. This will create a redirect from HTTP to HTTPS, ensuring that your visitors always have a secure connection to your website.

cloudflare Redirect from HTTP to HTTPS

When you’re ready, don’t forget to click the “Save Changes” button at the bottom or top of the screen to save this setting.

Optimising Cloudflare for WordPress using a plugin

cloudflare plugin speed

Cloudflare offers a dedicated Cloudflare Free CDN plugin for WordPress with settings optimised for WordPress with just one click.

The Cloudflare Free CDN plugin allows you to quickly set up Cloudflare on your WordPress site, add sets of web application firewall (WAF) rules, automatically clear the cache, and more.

To get started, install and activate the Cloudflare plugin on your website. For more details, see our step-by-step guide on how to install a WordPress plugin.

Once you’re ready, visit Settings » Cloudflare in your admin panel to configure Cloudflare settings.

On the settings page, you will see a button that says “Create your free account” and an option to log in for existing accounts. Simply click on the “Log in here” link.

Optimizing Cloudflare for WordPress using a plugin

On the next screen, you’ll need to enter your email in Cloudflare and the API key.

Click on the link that says “Get your API key from here.”

API key for Claudflare

This will show a pop-up window for your Cloudflare website account zone. 

Ensure you are on your “My Profile” page, then click on the “API Tokens” section in the left sidebar. 

Next, go to the “Global API Key” section and click on the “View” button. 

cloudflare Global API Key

This will open a pop-up window and display your API key.

Simply click on the key to copy it.

claudflare your API key

Then, you need to go back to the WordPress dashboard and enter your email address and API key.

Click on the “Save API Credentials” button.

cloudflare saved API data

Afterwards, Cloudflare settings will appear on your management dashboard.  

From here, you can apply WordPress optimisation with one click, clear the cache, enable automatic cache, and more. 

To optimise your WordPress site, simply click on the “Apply” button next to “Apply default settings.”

cloudflare Apply default settings

Then click on the “Settings” option from the menu.

Here, you will find more site optimisation settings.

 

cloudflare plugin speed

You can scroll down on this screen to find the “Security” section.

By default, the protection level is set to medium. To enhance your website’s security, you can choose “High” from the dropdown.

cloudflare plugin security

We hope this article has helped you learn how to set up the free Cloudflare CDN in WordPress using a plugin. 

Victoria Pencheva
About the author
Call Now Button