Do you want to use Cloudflare CDN on your WordPress site?
Cloudflare is one of the best WordPress CDN and firewall services available in the market. They offer a free CDN that speeds up your website along with a suite of powerful security features for small business websites.
The challenge is that many entry-level users are not able to utilize Cloudflare because they think it is hard to set up.
In this guide, we will walk you through a complete Cloudflare setup in WordPress to help you improve your website speed.
Table of Contents:
What is CDN? Why You Need a CDN for Your Site?
A CDN or Content Delivery Network is a system of distributed servers which helps deliver your website files faster to the users based on their geographic location.
Typically, a web hosting service serves your website visitors from a single location. All the users access the same server, no matter where they are located. This can result in a delay in content delivery for users living further away from your website’s central hosting server.
CDN solves this problem by setting up multiple edge servers in different locations around the globe. These CDN servers cache static content from your site’s origin/central server, store, and present them to the users after they request for it.
When there is a user request, the CDN server closest from the user’s location will handle it. For example, if someone in the USA wants to access a UK-hosted website, then a CDN server in the USA will serve that request, not the main sever in the UK.
With CDN, all the user requests are handled by the nearest CDN servers. This mitigates the physical distance between the visitors and your website’s server. As a result, your website loads faster for all users regardless of their geographic location.
A faster website also improves user experience and gives your website a slight boost in SEO rankings.
Using a CDN also reduces the load on your primary server and protects it from crashing during traffic spikes. If you want to learn more, see our guide on why you need a CDN for your WordPress blog.
What Is Cloudflare CDN?
Cloudflare is the most popular free CDN provider available on the internet. It is a large network of globally distributed servers which automatically cache static content and deliver dynamic content swiftly.
On top of a CDN service, Cloudflare is also 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 that’s suitable for small business websites and blogs. They also offer 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 utilize all Cloudflare features, then you will need the Business plan which costs $200 / month.
Editor’s note: We do not use Cloudflare on WPBeginner. Instead we use MaxCDN (now part of StackPath) for our CDN service. They do not force you to use their DNS and offer more reasonable pricing at scale.
MaxCDN vs. Cloudflare – What’s the Difference?
MaxCDN and Cloudflare are both quite different services actually. While MaxCDN is focused on serving your content through their CDN, Cloudflare is more focused on security and spam control.
They both use different technologies to serve content through their networks. MaxCDN serves content from your website’s DNS using pullzones, simply put they mirror your website. Cloudflare, on the other hand, serves content through their own DNS, and you are asked to change your website’s DNS to point to their servers.
Cloudflare acts as a proxy between you and your website’s visitors, which means you give up a lot of control. Whereas MaxCDN acts as a reverse proxy, which means you have all the control.
Cloudflare is better at optimizing your page speeds by preventing your site from malicious bots, attackers, and suspicious crawlers. MaxCDN is better at improving your website speed by serving your static content through their servers located around the world.
Cons of Using Cloudflare
The biggest user complaint with Cloudflare is that while it speeds up your website, sometimes it will add a second loading screen for security verification purposes which defeats the purpose of speed because users often have to wait 5 seconds before they can see your website.
Sometimes it can also display a CAPTCHA page asking users to prove that they are human. This creates a bad experience for first-time visitors who may never revisit the site.
Setting Up Cloudflare on Your WordPress Site
Setting up Cloudflare on a WordPress site is quite easy. There are two different methods:
- By using a single-click Cloudflare setup option in your host’s control panel
- By signing up manually on Cloudflare website
The first method is the easiest way to enable Cloudflare CDN on your WordPress blog. Some of the top WordPress hosting services like SiteGround have partnered with Cloudflare to offer an easy setup option through their control panel.
If your web host doesn’t offer a built-in Cloudflare setup option, then you can manually add the service on your site. We will show both of these methods in details below.
Method 1: Setting up Cloudflare CDN with One-Click Setup Option in cPanel
As we mentioned earlier that some WordPress hosting providers like SiteGround offer an easy option to configure Cloudflare CDN in WordPress.
These web hosts provide a built-in Cloudflare integration app in your hosting cPanel to enable the service with just a few clicks.
This Cloudflare setup option works similarly with most hosting providers that have the integration. For your reference, we will show the setup process on SiteGround hosting.
Enabling Cloudflare CDN on SiteGround
If you are using SiteGround as your WordPress hosting company, then you can set up Cloudflare CDN on your site in just a few minutes.
To get started, login to your cPanel and navigate to the ‘Site Improvement Tools’ section. After that, click on the ‘Cloudflare’ icon.
SiteGround recently started switching to a new control panel. If you’re using the new panel, then you’ll see Cloudflare listed under Speed tab. For example, take a look at the screenshot below.
To enable Cloudflare free CDN on your website, just click on the ‘Set Up’ button to continue.
After that, you will see a popup asking you to create a Cloudflare account or connect to your existing one.
Next, you will see a message indicating that the CDN activation is in progress. Once it is complete, the Cloudflare CDN will be active on your WordPress site.
Method 2: Setting up Cloudflare CDN in WordPress Manually
If your web hosting doesn’t have a single click Cloudflare configuration option, then you can use this method. It can take a few more minutes, but it is also easy and user-friendly.
To begin, you need to visit CloudFlare website and click on the ‘Sign Up’ button.
On the next page, you need to enter your email address and password to create a Cloudflare account. Simply enter the information required, and then click on the ‘Create Account’ button.
After that, you need to enter your website’s URL.
On the next screen, you will be asked to choose a plan. For the sake of this tutorial, we will select a free plan.
After that, Cloudflare will show you a list of all DNS records their systems found. This will include your subdomains as well.
The DNS records you want to be passed through Cloudflare will have orange cloud icon. The DNS records that will bypass Cloudflare will have a gray cloud icon.
You need to review the list to make sure that your primary domain is active on Cloudflare with an orange cloud icon.
Once you verify your DNS records, click on the Continue option at the bottom.
On the next and the final step of your setup, Cloudflare will ask you to update your nameservers. You will be asked to change your name servers and point them to Cloudflare nameservers.
Notice: Changing name server can take some time to propagate through all over the internet. During this time, your website may become inaccessible for some users.
You can change name servers either from your domain registrar account like Domain.com, or if you got a free domain from your web hosting provider like Bluehost, then you will have to change the name server by logging into your hosting account.
For the sake of this tutorial, we will be showing you how to change the name servers from the Bluehost control panel. While the process is similar across hosting companies, you can always ask your hosting provider for detailed instructions for their control panel.
Once you are logged on to your Bluehost cPanel dashboard, go to ‘Domains’ section, and select your domain name. After that, click on the ‘Name Servers’ tab and ‘Edit’ option.
Next, you need to select ‘Custom’ and enter the nameservers provided by Cloudflare.
After that, you need to go back to Cloudflare setup page, and click on ‘Done, check nameservers’ button to finish the setup.
That’s it! Now it will take a few minutes to update your domain nameservers and activate Cloudflare.
Once activated, you will see the success message on your Cloudflare dashboard.
You can now customize your Cloudflare settings from this dashboard. We will show you the most critical settings in the next section.
Note: The above screenshots show Bluehost control panel. Your nameserver settings may look different if you’re using a different hosting provider.
Configuring Most Important Cloudflare Settings
Your basic Cloudflare set up is complete, but there are a few essential settings you need to configure to keep your WordPress site secure.
1. Configure WordPress Specific Page Rules
By setting up page rules, you can customize how Cloudflare works on specific pages on your site. It is especially useful in securing critical pages like login page, wp-admin area, etc.
Cloudflare free account allows you to set up three page-rules. If you want to add more page rules, then you need to pay $5 per month for five additional rules.
First, you need to click on the Page Rules option at the top and then click on the Create Page Rule button.
After that, you can set up the following three page-rules.
a) Secure your WordPress login page
Page URL: example.com/wp-login.php*
Setting: Security Level; High
b) Exclude WordPress Dashboard from Cloudflare and Enable High Security
Page URL: example.com/wp-admin*
Settings: Security Level; High
Cache Level; Bypass
Disable Performance
Disable Apps
c) Force HTTPS
Page URL: http://*example.com/*
Setting: Always use HTTPS
2. Configure SSL Certificate Settings
Another important setting is the SSL certificate available in the ‘SSL/TSL’ menu at the top.
Make sure to choose ‘Full’ if you are already using SSL.
If you don’t have an SSL certificate, then see our guide on how to get a free SSL certificate for your website.
Once done, Cloudflare will provide a coveted green padlock to signify that your website is secure.
Optimizing Cloudflare for WordPress Using a Plugin
Cloudflare offers a dedicated WordPress plugin for one-click WordPress-optimized settings. The plugin lets you quickly set up Cloudflare on your WordPress site, add web application firewall (WAF) rulesets, automatically purge 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 done, you need to visit Settings » Cloudflare from your admin panel to configure Cloudflare settings.
On the settings page, you will see a Create Your Free Account button and Sign-in option for already existing accounts. Simply click on the sign-in option.
On the next screen, you will need to enter your Cloudflare email and API key.
You can find your API key in your account area on the Cloudflare website.
Simply open the ‘My Profile’ page and then click on the API tokens. After that, go to the Global API Key section and click on the View button.
This will open a popup and display your API key. You need to copy the key.
Next, come back to your WordPress dashboard and enter your email address and API key.
After that, Cloudflare home page will appear on your dashboard. From there, you can apply a single-click WordPress optimization, purge cache, enable automatic cache, etc.
You can find more Cloudflare options by clicking on the Settings option.
It also shows stats such as visitors, bandwidth saved, threats blocked, etc. from the Analytics option.
We hope this article helped you to learn how to set up Cloudflare free CDN in WordPress. You may also want to see our complete WordPress website security guide.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
