Speed and security are two of the most important requirements of a WordPress website. That’s why we’ve spent countless days and nights (and eaten yet more countless donuts) in building the most impressive managed cloud platform for hosting WordPress sites.
However, hosting is not the only factor involved in improving the speed of your WordPress site. One other way to do so is through a CDN, which stands for the content delivery network. In this article, I’ll show you how to easily install and configure Cloudflare CDN for your WordPress website.
- What is Cloudflare CDN?
- Setting Up Cloudflare CDN in WordPress
- Adding Let’s Encrypt Certificates to Cloudflare
In this article, I will show you how to configure Cloudflare CDN on WordPress. Before embarking on the setup process, let’s understand what Cloudflare CDN is, and how it helps you optimize your Core Web Vitals.
What is Cloudflare CDN?
Cloudflare CDN is one of the most popular CDNs available out there with a network covering more than 200 cities. It serves the web content of websites based on geographic distance of visitors on the site.
It delivers static, dynamic and media content, along with other services such as security, optimization and SSL. Websites using a Cloudflare CDN service minimize latency at the user’s end, as their content is cached and delivered from the nearest server.
Let’s take a look at the features that Cloudflare CDN provides.
Some Prominent Features of Cloudflare CDN
- Smart Routing
- Stream Delivery
- Load Balancing
- Accelerated Mobile Pages
Cloudflare CDN is a renowned CDN provider with servers spread all over the globe to serve the content of your website to every corner of the world. Cloudflare offers multiple features depending on the plan.
This is a smart way of routing traffic through the fastest network available, with an algorithm that utilizes real-time network intelligence to decide the fastest path.
Media streaming can be time-consuming to load if accessed from the other corner of the region. To solve this problem, Cloudflare CDN offers a special caching mechanism to deliver stream files instantly.
Cloudflare offers a subscription-based load balancing feature that starts from $5 per month. It’s a DNS-based load balancing that helps applications to improve performance and site availability.
Cloudflare on WordPress offers an advanced caching mechanism that automatically saves the static content, cache purging, and tiered caching.
We have seen that a typical website uses both dynamic and static content. Cloudflare can save you on both CPU and the bandwidth juice of your web hosting by using its own servers for content. Cloudflare on WordPress can reduce the latency of the end-user and enhance the overall user experience.
At times we need to integrate third-party tools and APIs for specific functionality. These resources are not in our control, and if not configured properly, can cause lags.
Cloudflare is designed to deliver a fast web experience and optimize the order of page resources.
Large or non-optimized images can cause performance issues. The Cloudflare Image Optimization algorithm optimizes the web page automatically by minimizing the number of network connections and making image delivery seamless. This prevents third-party resources from slowing down the web page.
Accelerated Mobile Pages
Accelerated Mobile Pages is a technique to load web pages faster on mobile devices when searched from Google’s mobile search engine. More and more users are using their mobile devices to browse the internet.
Cloudflare CDN accelerated mobile links are powered by AMP, and load AMP-enabled web pages inside the viewing window three times faster than the standard mobile pages.
Cloudflare provides several options like CDN, optimization of ads, DDoS security, analytics, and much more. They also offer a free plan that you can use before purchasing a paid plan.
Setting Up Cloudflare CDN in WordPress
Cloudflare provides many options like CDN, optimization of ads, DDoS security, analytics, and more. Besides free plans, they offer multiple premium plans where you will have more powerful features.
MaxCDN and Cloudflare are two widely used CDN providers by WordPress users. In this tutorial, I will be sharing how you can install Cloudflare on a WordPress website hosted on Cloudways.
Step 1: Signing Up for Cloudflare
First, you need to create an account on Cloudflare. If you already have it in place then you can skip this step.
Step 2: Adding Site URL
Once you sign up on Cloudflare, a new screen will pop up where you will have to provide your domain and click Add site.
Step 3: Select Your Cloudflare Plan
Once you add the site URL, Cloudflare will ask about the plan that you want to avail. For this tutorial, I’m going with the FREE plan.
Step 4: Review DNS Records
The next step is to review your DNS records and check whether they are configured correctly or not. Here, Cloudflare will fetch all the DNS configuration from your domain registrar, and in my case, there are only two DNS records (Type A). Review your records and simply click Continue.
Step 5: Change Your NameServer
As you can see in the image below, you need to change your domain registrar’s nameservers and replace them with the ones Cloudflare has provided.
Step 6: Change your NameServer from Domain Registrar
Now, open your domain registrar and change the name servers. My domain is with Freenom, and I’ve successfully changed the nameservers.
Step 7: Cloudflare Quick Start Guide
Once you change the nameservers, go back to the Cloudflare CDN Settings tab, click Done, and check nameservers. You’ll see a Quick Start Guide screen popup.
Next, simply click Get Started and configure the domain settings to improve your security and performance. The first setting section is Improve Security and it has 2 sub-sections; Automatic HTTPS Rewrites and Always use HTTPS. I will go with the default security configurations and click on the Save button.
Next in the process is Optimize Performance, and it also has two sub-sections; Auto Minify and Brotli. The Auto Minify section is the HTML, JS, and CSS minification section that will help you speed up your WordPress site. I’m selecting all the options for Auto Minify, and for Brotli, I’m going with the default setup.
Note: If you select minification on Cloudflare, then avoid it on Breeze or any other Cache plugin. Why? Enabling minification on both ends will cause issues, and it’s recommended to use one at a time.
The last section is Summary, where you will see your security and performance configurations. Once you are satisfied with the settings, click Finish.
You will receive the following notification in your Cloudflare dashboard “Great news! Cloudflare is now protecting your site”. The status will change to “Active,” and you can avail of various options in the top panel to configure various security and performance-related tasks.
To take full advantage of Cloudflare on the WordPress website, it is recommended that you install their plugin on your website.
Step 8: Check Cloudflare CDN Status
If you want to check whether your Cloudflare CDN is working or not, open your WordPress site on any browser > press “Ctrl + Shift + i” > Network. Then refresh your page where you will see your site’s requests. Click one of the requests and check for “cd-cache-status”. If it’s HIT, then your CDN is working fine.
Adding Let’s Encrypt Certificates to Cloudflare
With Cloudways, you can create an SSL certificate for your WordPress site using Let’s Encrypt. It cannot be created while Cloudflare is activated on your domain. In order to activate the Let’s Encrypt certificate, follow the steps below:
Step 1: Log in to your Cloudflare dashboard and under the DNS tab, disable both www and yourdomain.com options by changing the proxy status to DNS only. A grey cloud means that the service is disabled.
Step 2: Go to your Cloudways Application Management Panel, SSL Certificate Enter your Email Address > Domain Name, and Click Install Certificate.
Step 3: Now, go to your Server Management Panel > Settings and Packages > Advanced tab, and under WAF Module, choose Cloudflare.
Step 4: Go back to Cloudflare dashboard and enable the option we disabled in step 1.
Step 5: Next, click on the SSL/TLS tab at the top and turn SSL to Flexible. It can take up to 24 hours for Cloudflare to activate the certificate. However, if you already have used the same domain before, it will get activated instantly.
That’s all! You get a whole bunch of options after you have configured Cloudflare on your WordPress site. Most of the options are for paid plans, but if it helps, we recommend upgrading your plans and taking full advantage of it!
Cloudflare on WordPress improves the experience of users visiting your site and saves your web server’s valuable CPU and bandwidth resources. It is a highly optimized CDN that can completely take away the worry of latency and boost your WordPress site speed.
Frequently Ask Questions (FAQs)
Is Cloudflare a hosting provider?
No, CloudFlare CDN is a content delivery network provider which offers CDN services. Websites using their services have access to their huge network of servers through which it serves the static and dynamic content of the site minimizing latency at the user end.
What Is The Difference Between MaxCDN and Cloudflare?
Cloudflare comes with an option of a free plan, while MaxCDN does not. Cloudflare is easy to set up and offers website security. MaxCDN can be set up using the W3 Total Cache plugin and is used by renowned businesses.
Customer Review at
“Beautifully optimized hosting for WordPress and Magento”
Arda Burak [Agency Owner]
Farhan is a community manager at Cloudways. He loves to work with WordPress and has a passion for web development. Mostly, he spends his time interacting with the people in the WordPress community. Apart from his work life, Farhan spends his time gaming and playing sports. Feel free to contact him at [email protected]