How to Setup Cloudflare CDN for Your WordPress Website – to Optimize Speed, Bandwidth Usage and Security (Guide 2019)

In this guide, you will learn how to setup Cloudflare CDN with the best settings.

So that it makes your WordPress website,

  • Loads faster.
  • Consumes lesser bandwidth.
  • Becomes more secure.

Cloudflare offers this bunch of great benefits with totally ZERO cost. There is no reason not to be using it.

This tutorial will walk through all the way from setting up Cloudflare to your website until configuring each of the Cloudflare settings.

Let’s get started.

How to setup cloudflare CDN? #wordpress #wordpresstips #wordpressforbeginners #websitespeed
How to setup Cloudflare CDN for your WordPress website? #wordpress #wordpresstips #wordpressforbeginners #websitespeed

1. What Is Cloudflare CDN? Why Use It?

Cloudflare CDN (Content Delivery Network) caches the content of the website and strategically store the caches across the world in its data centers. There are 180 data centers around the world which have the largest CDN network in the world.

Cloudflare CDN can only be used to cache content, but it is not a web host for hosting your website.

The 4 main benefits you get if using Cloudflare CDN.

  1. Improving website load times – By distributing the cached content across the world and delivering the content from a nearby CDN server which is closer to your website visitors, visitors manage to get faster website loading time. The faster the loading time, the better the user experience.
  2. Reducing bandwidth consumption – The primary expense for a web hosting is from the data bandwidth consumption. Most web hosts will limit the access or speed to your website if the bandwidth of the month is exceeded. By using the caching from Cloudflare, it is able to reduce the amount of data to transfer from your origin server, hence reducing the bandwidth usage.
  3. Increasing content availability and redundancy – With the distributed cached content, Cloudflare make your website always available to the visitors even if your server suffered limited hardware access or hardware failure.
  4. Improving website security – Cloudflare also improves the website security by stopping malicious traffic before it reaches to your origin server. Cloudflare analyzes every potential threat from the visitor requests.

2. How to Setup Cloudflare CDN?

There are two ways to setup Cloudflare which are partial (CNAME) setup and full DNS setup.

Partial (CNAME) means your DNS settings are still managed by your origin web host (through cPanel dashboard) whereas full DNS setup means your DNS settings are fully managed by Cloudflare (through Cloudflare dashboard).

My recommendation is to go for the full DNS setup. Because the DNS lookup time through Cloudflare is really fast, thus improves your website loading speed.

Nevertheless, the installation steps for both partial and full DNS are only slightly different. Partial DNS goes through cPanel while full DNS goes through Cloudflare website. The nameserver for partial DNS setup maintains at the original host while the nameserver will be changed to Cloudflare’s nameserver for full DNS setup.

1. Access to Cloudflare

  • For Partial (CNAME) setup
  1. Login to CPanel
  2. Click the Cloudflare icon in the Software section
  • For Full DNS setup
  1. Enter Cloudflare website.

2. Register an account.

3. Add a website, fill in your domain name.

Cloudflare add a website

4. Cloudflare will scan your DNS records, click Next once it is done.

Cloudflare querying DNS record v2

5. It will show the list of your DNS results, click Continue to proceed.

Cloudflare query results v2

6. Choose Free Plan and click Confirm plan.

Cloudflare select plan

7. Click Confirm.

Cloudflare confirm plan

8. You will be provided 2 Cloudflare nameservers, change the nameservers from your domain name registrar. (Ignore this step for partial CName setup).

Change nameserver

3. How to Configure Cloudflare CDN?

There are 5 important sections that you need to configure in Cloudflare. (I only explain those settings which are important and provided a screenshot of my settings for each section.)

3.1. Crypto

The Crypto setting controls the security of your website.

SSL – Full / Full(Strict). It controls the secure connection between both the visitor and your Cloudflare domain and between Cloudflare and your web server. Please choose Full or Full(Strict) value if your website is protected with SSL certification.
Always Use Https – ON. Turn ON this to redirect all HTTP requests to HTTPs using a 301 redirect.
Opportunistic Encryption – OFF. Turn OFF this value as this is only useful for HTTP website. This will allow the browser to benefit from the performance of HTTP/2 even though it is not HTTPS website. For HTTPS website (highly recommended), just turn OFF this.
Automatic HTTPS Rewrites – ON. This helps to fix mixed content by changing HTTP to HTTPS for all resources or URLs on your web site that can be served with HTTPS.

crypto tab

3.2. Speed

It improves the speed of your website.

Auto Minify – OFF. I would recommend to turn OFF minification for all Javascript, CSS and HTML at Cloudflare. Cache plugin can do this as well, in addition, cache plugin like Swift Performance comes with advanced feature like fixing errors during minification. The minification is only required to do once either from Cloudflare or your cache plugin (recommended).
Railgun – ON. Turn ON this if your web hosting includes Railgun in your web hosting package. Because it can accelerate the delivery time of dynamic content. This is helpful for visitors which is far away from the origin server.
Brotli – ON. Improve website loading time for your visitor’s HTTPS traffic by applying Brotli compression. It is similar to gzip compression but believes faster than gzip.
Rocket Loader – OFF. Turn OFF this. We can do this at the cahce plugin. It will asynchronously load JavaScript files.

speed tab

3.3. Caching

It controls the cache settings for your website

Caching level – Standard. Please look at the values below to understand which value suits you the best. For me I use standard.

  • No Query String – only delivers cached files when there is no query string.
  • Ignore Query String – delivers the same resource to everyone regardless of query string.
  • Standard – delivers different resource each time the query string changes.

Always Online – ON. If your server goes down, Cloudflare will try to show a cached version of your website to your visitors.

caching tab

3.4. Page rule

It controls your Cloudflare configuration by URL

Page Rules – Cache everything. Don’t cache wp-admin, and wp-login.php. Just follow the 3-page rules that I set for better performance. It will improve website loading speed as well as reduce the bandwidth consumption from the origin server. The caches for wp-admin and wp-login.php are bypassed because it is not necessary and will cause confusion.

page rule
page rule cache everything
Cache everything for every pages
page rule wp admin
Don’t cache the wp-admin page
page rule wp login
Don’t cache the login page.

3.5. Scrape Shield

It protects the contents of your website.

Hotlink Protection – ON. Prevents people from linking your website’s images on their own website, or else, you would still be hosting these images and consuming your bandwidth from every request.

scrape shield

Wrapping Up

With the Cloudflare setup and settings configuration, your WordPress speed, bandwidth usage, and security will be definitely improved. You could check your page loading speed from GTMetrix.

Please comment below if you have any questions during setting up/configuring the Cloudflare.

If you still couldn’t get the better page speed, you probably have to check for your web hosting and your cache plugin. I have a complete WordPress speed optimization guide which can help you to further improve your page loading speed.

Affiliate Disclosure – Some blog posts and web pages within this site contain affiliate links, which means I may earn a small commission if you click the link then purchase a product or service from the third party website. For instance, A2Hosting, Astra Pro and Swift Performance affiliate links. Purchasing a product or service from the links does not increase your purchase cost, but it is a great way to say ‘thanks’ to me if you enjoy my content and find my suggestions helpful. Please note that I only recommend products and services that I have personally used or have thoroughly researched. The guidances are based on my personal experience and research. I really appreciate your action of clicking my links to purchase, this is a great motivation for me to keep going.,

Comments

Please feel free to comment below if you have questions, requests or feedbacks from my blogs. I will be glad to hearing your responses and reply to you as sooner as possible.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top