This website uses cookies

Our website, platform and/or any sub domains use cookies to understand how you use our services, and to improve both your experience and our marketing relevance.

📣 Try the fastest hosting platform with pay-as-you-go pricing & 24/7 expert support! MIGRATE NOW →

Cloudflare WordPress CDN: Easy Setup Guide For Beginners!

Updated on March 1, 2024

16 Min Read
cloudflare wordpress

Speed and security are two essential requirements of a WordPress website. Although Cloudways is the most impressive managed cloud platform for hosting WordPress sites, hosting is not the only factor in improving your WordPress site’s speed.

Another way to solidify your site’s security and speed is by using a CDN (content delivery network). And in the realm of CDNs, no CDN comes close to Cloudflare regarding coverage.

In this article, I’ll show you how to easily install and configure Cloudflare CDN for your WordPress website. First, we’ll look at the Cloudways method (easy), and then we’ll look at how to integrate Cloudflare with your WordPress site if you’re not a Cloudways user.

Why Opt for Cloudflare on Cloudways: Free vs Enterprise?

Cloudflare offers four pricing plans: Free, Pro, Business, and Enterprise. The free version comes with some limited features. For example, the free plan only allows 3-page rules and simple bots mitigation.

For the paid plans, it is important to note that Cloudflare bills based on features, not bandwidth.

  1. The Free plan offers basic performance and security.
  2. The Pro Plan at $20/month provides advanced performance with image optimization and WAF.
  3. The $200/month Business plan provides DDoS attack protection, prioritized support, WAF, and dynamic content compression.
  4. Lastly, the Enterprise plan is a custom plan based on customer requirements with a dedicated solution engineer and support. The Cloudflare Enterprise plan is the most premium option, with monthly costs ranging from $1000 to $5000.

With Cloudways Cloudflare Enterprise add-on, these prices are reduced significantly. The initial cost for the add-on is $4.99 per domain, but if you activate the add-on for hundreds of applications, the price decreases to $1.99 per domain. The is the most affordable solution for better quality, performance, and security. You can see the Cloudflare pricing plans and features here.

How to Set Up & Install Cloudflare Enterprise via Cloudways (Easier Method)

Recognizing Cloudflare’s reliability, Cloudways partnered with it, bringing the enterprise security solution for as low as $1.99/month. With Cloudflare Enterprise, you can score higher on Core Web Vitals, safeguard your websites from DDoS attacks, avoid malicious traffic with a Web Application Firewall (WAF), and receive HTTP3 support.

Here’s how you can easily activate the Cloudflare Enterprise add-on for your applications on the Cloudways Platform:

Boost Core Web Vitals with Cloudways Cloudflare Enterprise

Enhance your website’s Core Web Vitals and overall performance with Cloudways Cloudflare Enterprise for as low as $1.99/month per domain.

Step 1: Select Cloudflare in the WordPress Application

  • Log in to the Cloudways Platform and create a server by clicking on the +Add Server button.

Log in on a Cloudways Platform and create a server

  • Fill up the Application and Server Details. I chose WordPress as my application and a 2GB DigitalOcean server. Once done, click on the “Launch Now” button.

Fill up the Application and Server Details

Step 2: Point Your Domain to Your Domain Registrar

  • Now that you’re done with creating a server and choosing WordPress as your application, you must point your domain to your domain registrar. Since I’m using Namecheap, I’ll log in to my account and add my server’s IP address in the A record section.
  • To do this, copy your server’s IP address. You can find it in the servers tab, as shown in the screenshot below.

copy your server's IP address

  • Now I’ll head over to Namecheap, where my domain, whichserversize.net, is registered, and log in to my account.
  • Next, go to the Advanced DNS tab in Namecheap > select A record from the Type drop-down. You’ll need to do this step twice.
  • Next, add your server’s IP address. For the first A record, type @ in the Host field and paste your server’s IP address in the value field.
  • For the second A record, type “www” in the Host field. And paste your server’s IP address in the value field.

Point Domain to Your Domain Registrar

  • Now, go back to the Cloudways platform and go to your application.
  • Next, go to the Domain Management tab and select the + Add Domain button.

go to the Domain Management tab and select the + Add Domain button

  • After this, type in your domain name in the new popup window and click on the + Add Domain button.

click on the + Add Domain button

  • After this, simply checkmark your domain and click on the three dots.
  • Next, click on Make Primary.

checkmark your domain and click on the three dots. click on Make Primary

  • Now that your domain is properly pointed and you have also made it primary in the Cloudways platform, you’re all set to configure Cloudflare enterprise.

Step 3: Enable Cloudflare Enterprise in the Cloudways Platform

  • Select the WordPress application on which you want to add Cloudflare Enterprise.

Select the WordPress application on which you want to add Cloudflare Enterprise

  • Under the Application Management tab, click on the Cloudflare option.

Under the Application Management tab, Click on the Cloudflare option

  • Enter your domain name and click on the Enable button. It will take some time.
  • After enabling Cloudflare, you’ll see the status as Domain not Live.

Domain not Live status after enabling Cloudflare

Step 4: Point Your Domain to Cloudflare By Adding CNAME Records

  • Once your domain verification is complete, you’ll see a prominent ‘View CNAME Records’ button. Click on it.

View CNAME Records in the cloudflare setting on cloudways platform

  • Here, you’ll see your CNAME Records. Copy the Hostname, and just like we added A record earlier in Namecheap, you must add CNAME.

point your domain to cloudflare

  • To do that, I’ll simply copy the Hostname, which is secure.cloudways.cloud, and paste it after selecting CNAME Record from the dropdown menu in Namecheap. Like previously, you’ll have to perform this step twice.
  • For the first CNAME record, type “@” in the Host field and paste secure.cloudways.cloud in the Value field.
  • For the second CNAME record, type “www” in the Host field and paste secure.cloudways.cloud in the Value field.

update Cname records in your domain registrar

  • Now, click on the refresh icon, and the status will change to Active.
  • You’ll see a message “Your domain is successfully pointed to your Cloudflare Enterprise Network at the top-right corner.

check your cloudflare enterprise add-on status

You have successfully integrated Cloudflare Enterprise Add-on into your WordPress application hosted on Cloudways. You can also read the Cloudflare integration KBs for more detailed information.

Scale Your Projects Seamlessly with Cloudways WordPress Hosting

Boost Core Web Vitals, strengthen security, get expert support, and simplify management. Level up your WordPress hosting with Cloudways today.

How to Set Up Cloudflare CDN on WordPress (Manual Method)

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.

Let’s learn how to install Cloudflare on a WordPress website.

  • Sign Up for Cloudflare
  • Add the Site’s URL
  • Select Your Cloudflare Plan
  • Review DNS Records
  • Change Your NameServer
  • Change your NameServer from Domain Registrar
  • Cloudflare Quick Start Guide
  • Check Cloudflare CDN Status

Step 1: Sign Up for Cloudflare

  • First, you need to create an account on Cloudflare. If you already have it, you can skip this step.

Signing Up for Cloudflare

Step 2: Add the Site’s URL

  • Once you sign up on Cloudflare, a new screen will pop up where you’ll see a welcome message. Click the Add a website or application button at the end of the screen.

Add a website or application to cloudflare

  • Type in your domain and hit Continue.

 

Step 3: Select Your Cloudflare Plan

  • Once you add your domain, Cloudflare will ask about the plan you want to avail. For this tutorial, I’m going with the Free plan. You can upgrade at any time if you need more features.

Select Your Cloudflare Plan for you domain

Step 4: Review DNS Records

  • The next step is to review your DNS records and check whether they are configured correctly or not.
  • Cloudflare will fetch all the DNS configurations from your domain registrar.
  • In my case, only two DNS records (Type A) exist.
  • Review your records and click Continue.

Review your records

Step 5: Change Your Nameserver

  • As you can see in the image below, you need to change your domain registrar’s nameservers.
  • Replace them with the ones Cloudflare has provided.

Change Your Nameserver

Step 6: Change your Nameserver from Domain Registrar

  • Now, open your domain registrar and change the name servers.
  • Copy Cloudflare’s Nameservers.
  • Paste them on your domain registrar Nameserver option.
  • My domain is with Namecheap, and I’ve successfully changed the nameservers.

Step 7: Cloudflare Quick Start Guide

  • Once you change the nameservers on the domain registrar, go back to Cloudflare.
  • Click on the Check nameservers button.

Check nameservers

  • You should now see a message on your screen saying, “Great news! Cloudflare is now protecting your site”.

You should now see a message on your screen saying, “Great news! Cloudflare is now protecting your site”

  • You’ll also receive an email from Cloudflare notifying you that your Cloudflare status is now active.

You'll also receive an email from Cloudflare notifying you that your Cloudflare status is now active

  • Now that Cloudflare is integrated into your site, you can tweak a few recommended settings using the Quick Start Guide.
  • Simply click the Review settings button, and enable a few recommended settings.

Review settings

  • Next, click on the Get Started button.

complete cloudflare's recommended settings

  • Now, enable both Automatic HTTPS Rewrites and Always use HTTPS.

enable both Automatic HTTPS Rewrites and Always use HTTPS

  • Next, enable Brotli and hit Save.

Note: You may find our guide on Brotli vs. Gzip compression helpful.

enable Brotli and hit Save

  • After reviewing the summary, click on Finish.

Finish the cloudflare recommended settings

If you want to take full advantage of Cloudflare, I recommend installing the Cloudflare plugin on your WordPress website.

Step 8: Check Cloudflare CDN Status

Follow the below steps to check your Cloudflare CDN is working on your WordPress site.

  • Open your WordPress site on a web browser.
  • Right-click on the site and click on Inspect.
  • Now, click on the Network tab on the Inspect console.
  • Click on any JS or CSS file from the left corner.
  • Now, if your cf-cache-status shows HIT, your CDN is working fine.

Cloudflare CDN Status

How to Manage Cloudflare Settings

Your basic Cloudflare setup is complete. Still, there are a few vital configurations to enhance your WordPress site’s security:

1. Secure Your WordPress Login Page

You can use page rules to customize how Cloudflare functions on specific pages of your site, particularly critical ones like the login page and wp-admin area.

With a free Cloudflare account, you have access to 3 page rules. You can opt for five extra rules at $5 per month if you require more.

  • Click on “Rules” in the left menu and then “Create Page Rule.”
  • Begin by creating a rule to secure your WordPress login page with the following settings:

cloudflare page rules

  • Page URL: example: mywebsite.com/login-page*

create a page rule in cloudflare

  • Settings: Security Level – High
  • After configuring, click “Save and Deploy” to activate the rule.

2. Exclude the WordPress Dashboard from Cloudflare

Create a second rule to exclude the WordPress dashboard from Cloudflare caching and apply high security.

  • Click “Create New Rule” to set up your second rule.
  • Configure the rule with these settings:
    • Page URL: mywebsite.com/wp-admin*
    • Settings: Security Level – High, Cache Level – Bypass, Disable Performance, Disable Apps
  • Click “Save and Deploy” to add the new rule.

Exclude the WordPress Dashboard from Cloudflare with page rules

3. Configure SSL Certificate Settings

Access the SSL certificate settings in the “SSL/TLS” menu on the left. If you’re already using SSL, select the “Full” radio button.

With these settings in place, Cloudflare will display a green padlock in your visitors’ address bar, indicating that your website is secure.

Configure SSL Certificate Settings

4. Auto Minify

Auto Minify optimizes your website by reducing the size of JavaScript, CSS, and HTML files, improving page loading times.

Cloudflare removes unnecessary characters like comments and empty lines from HTML. For JavaScript and CSS, minification applies to cached files, so clear the cache to see changes on your WordPress site.

This feature is available on all Cloudflare plans. Enable it by going to Speed Optimization Content OptimizationAuto Minify and choose the file type to minify.

Auto Minify cloudflare

5. Rocket Loader

Rocket Loader speeds up content display by postponing the loading of JavaScript code until other content like text, images, and fonts are rendered.

Cloudflare’s Rocket Loader enhances the following performance metrics for pages utilizing JavaScript:

  • Time to First Contentful Paint (TTFCP)
  • Time to First Meaningful Paint (TTFMP)

Cloudflare provides the Rocket Loader feature to all users. To activate this optimization, go to Speed Optimization Content OptimizationRocket Loader in your settings.

Rocket Loader

6. Web Application Firewall (WAF)

Cloudflare’s Web Application Firewall (WAF) is a key security feature that helps safeguard your website from potential online attacks and DDoS attacks.

Utilizing machine learning, the WAF protects your WordPress site by preventing unauthorized account access, halting data leaks, and blocking login attempts using stolen credentials.

To configure these Cloudflare settings, navigate to Security WAF, where you’ll find four tabs: Custom rules, Rate limiting rules, Managed rules, and Tools.

Please note that while some firewall features are accessible with a free Cloudflare account, most require a Pro plan.

Web Application Firewall (WAF)

7. Cloudflare’s Caching Feature

Caching involves storing copies of static content temporarily, allowing browsers to access them more quickly, resulting in faster website loading times. Cloudflare offers caching solutions for both web browsers and DNS servers to enhance website performance.

To access Cloudflare’s caching features, go to CachingConfiguration. Here are some of the key features you can manage:

  • Purge Cache
  • Caching Level
  • Browser Cache TTL
  • CSAM Scanning Tool
  • Crawler Hints
  • Always Online
  • Development Mode

Additionally, Cloudflare offers settings for Cache Analytics, Tiered Cache, and Cache Reserve, but some of these options are available only with the premium version.

cloudflare caching options

Unlock Agency Success with Cloudways Managed WordPress Hosting

Empower your agency with Cloudways Managed WordPress Hosting – say goodbye to the need for an in-house IT team and hello to streamlined performance, security, and scalability.

How to Set Up & Configure the Cloudflare WordPress Plugin (Steps)

Cloudflare provides a dedicated WordPress plugin with one-click WordPress-optimized settings. This plugin allows you to set up Cloudflare on your WordPress site easily, add web application firewall (WAF) rulesets, and automatically clear the cache, among other features.

Cloudflare plugin

  • Once the plugin is active, navigate to “Settings » Cloudflare” in your admin panel to configure your Cloudflare settings.

Cloudflare plugin settings

  • On the settings page, you’ll find a “Create Your Free Account” button and a sign-in option for existing accounts. Simply click the “Sign in here” link to proceed.

login to your cloudflare account or signup

  • On the next screen, enter your Cloudflare email and API key by clicking the “Get your API key from here” link.

Get your API key

  • A popup window will appear in your Cloudflare account area. Ensure you are on your “My Profile” page, then go to the “API Tokens” tab in the left sidebar.

go to the 'API Tokens' tab

  • Navigate to the “Global API Key” section and click “View” to reveal your API key. Copy it by clicking on the key itself.

Navigate to the 'Global API Key' section and click 'View' to reveal your API key

  • Return to your WordPress dashboard and paste your email address and API key. Click “Save API Credentials.”

enter your api key

  • Your Cloudflare settings will now appear on your dashboard. You can optimize your WordPress site with one click by selecting “Apply Default Settings” and clicking “Apply.”

view cloudflare plugin settings

  • To access more site optimization settings, go to the “Settings” menu option.

access more site optimization settings

  • Scroll down to the “Security” section. By default, the security level is set to medium. Choose “High” from the dropdown list to enhance your website’s security.

change cloudflare plugin security settings to high

Common Cloudflare Problems

While Cloudflare may encounter occasional issues, most challenges can be efficiently resolved by following the recommended steps.

1. ERR_TOO_MANY_REDIRECTS or “The Page Isn’t Redirecting Properly”:

  • Issue: Flexible SSL is enabled with Cloudflare while your web server already has an SSL certificate.
  • Solution: Switch SSL mode to “Full” in Cloudflare settings or create a page rule to address the conflict.

2. Website Unavailability:

  • Issue: Cached copy or “Your Website is Unavailable” error.
  • Solution: Check server status using a curl command; contact hosting provider for server issues. Ensure Cloudflare’s IPs are allowlisted.

3. Inability to Access cPanel or Use FTP:

  • Issue: Cloudflare acts as a reverse proxy.
  • Solution: Access cPanel or FTP using alternative methods outlined in provided resources.

4. Issues Caused by Beta Features – Rocket Loader and Auto Minify:

  • Issue: Rocket Loader impacting JavaScript calls; Auto Minify causing conflicts.
  • Solution: Deactivate Rocket Loader if it causes issues, ensure that only one minification option is active, and adjust Rocket Loader settings if necessary.

5. Changes Not Reflecting on the Website:

  • Issue: Caching preventing immediate display of changes.
  • Solution: Turn on Cloudflare Development Mode when making changes or manually purge Cloudflare cache.

6. Cloudflare Data Center Issues:

  • Issue: Problems at a specific data center affecting local visitors.
  • Solution: Check Cloudflare’s System Status on X (Twitter) or system status page for updates.

7. Visitor Connection Issues:

  • Steps: Check server status; ensure Cloudflare’s IPs are not blocked.
  • Further Action: If problems persist, temporarily disable Cloudflare for prompt resolution, and report the details to Cloudflare support.

How to Clear Cloudflare Cache: Cloudways Approach to Cache Clearing

You can clear the Cloudflare cache on-demand, bypassing the CDN’s scheduled cache expiry. This process removes existing cached content from your website on the Cloudflare CDN, allowing the latest version to be served to visitors.

It’s important to note that this cache purge may temporarily slow down your website until the cache is recreated.

Clearing the Cloudflare cache for your applications on Cloudways is a straightforward process. Follow these steps:

  • Log in to your Cloudways account.
  • Navigate to the “Applications” tab and select the specific WordPress or WooCommerce application you want to clear the cache for.

cloudways application management screen

  • In the left sidebar, find and click on “Cloudflare.”
  • Within the Cloudflare Management tab, select “Overview.”
  • Click the “Purge” button to clear the Cloudflare cache for the chosen application.

Advantages of Using Cloudflare CDN

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 pricing plan.

1. DDoS Protection

Cloudflare provides comprehensive DDoS protection to secure your Websites, applications, and entire network. Cloudflare ensures the performance of legitimate traffic is not compromised.

The 209 Tbps (terabit per second) Cloudflare’s network blocks an average of 124 billion daily threats. It also includes some of the largest DDoS attacks in history.

Cloudflare was entitled as a Leader in the Forrester Wave™ report for the DDoS Mitigation Solutions 2021. Forrester states, ‘Cloudflare protects against DDoS from the edge, and fast.’ If your site, application, or network is under attack, Cloudflare can protect you from multiple threats, such as login attacks, bot attacks, layer 3 and 4 attacks, and more.

2. Web Application Firewall (WAF)

The WAF (Web Application Firewall) protects your website by filtering and monitoring HTTP traffic. It defends against major threats like SQL injection, file inclusion, and cross-site scripting (XSS). Cloudflare’s WAF offers layered security, safeguarding against OWASP-identified vulnerabilities and application layer threats, including zero-day attacks.

3. Reliability

As we discussed earlier, how big Cloudflare is, from the reliability perspective, millions of people, internet properties, and ecommerce giants use Cloudflare DNS to make their sites available to anyone worldwide. Cloudflare DNS service, resolving 2,270 billion DNS queries per day.

4. Caching

Cloudflare for WordPress includes an advanced caching system that automatically stores static content and provides features like cache purging and tiered caching. Most websites use a combination of dynamic and static content. Cloudflare helps conserve CPU resources and bandwidth on your web hosting server by handling content delivery through its servers. This results in reduced latency for end-users and an improved overall user experience.

Read More: How To Use Cloudflare CDN with W3 Total Cache Plugin

5. Optimizations

Cloudflare’s image optimization compresses and resizes images for quicker website loading. This enhances user experience and reduces bandwidth usage, saving hosting costs.

For example, Cloudflare Polish optimizes website images, reducing their size without quality loss for faster page loading. Cloudflare Mirage serves the best image version based on user device and network conditions, ensuring top quality without slowing down speed.

6. Accelerated Mobile Pages

Accelerated Mobile Pages is a technique to load web pages faster on mobile devices when searched by 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 more. They also offer a free plan you can use before purchasing a paid one.

7. Smart Routing

Smart Routing is routing traffic through the fastest network available, with an algorithm that utilizes real-time network intelligence to decide the quickest path.

Cloudflare’s network infrastructure is designed to intelligently route traffic through the fastest and most reliable paths, optimizing content delivery and ensuring a smooth and speedy user experience.

8. Stream Delivery

Media streaming can be time-consuming to load if accessed from the other corner of the region. Cloudflare CDN offers a unique caching mechanism to deliver stream files to solve this problem instantly.

9. Load Balancing

Cloudflare offers a subscription-based load-balancing feature that starts from $5 per month. Load Balancing protects against service disruptions by employing local and global traffic load balancing, geographic routing, server health checks, and failover mechanisms. This ensures the uninterrupted availability of your essential resources.

Summary

If you are a blogger, developer, or agency who is concerned with the security and performance of your website, you must try out Cloudflare CDN. It might be possible for you to think it is difficult to set up and configure Cloudflare on WordPress.

In this article, I’ve explained everything related to Cloudflare – from an overview to two different integration methods of Cloudflare: Enterprise add-on via Cloudways and setting up Cloudflare CDN on WordPress.

After reading this article, you’ll be able to know how easy it is to use Cloudflare CDN when you host your WordPress server on the Cloudways Platform. If you still have any questions related to Cloudflare CDN, please write them in the comments section, and I’ll be sure to get back to you.

Q1. Is Cloudflare free of cost?

A: Cloudflare is a Freemium service. They provide the Free version, but it has some limitations. You can select their Pro, Business, and Enterprise versions to enjoy full access to the features.

Q2. Is Cloudflare good for WordPress?

A: Yes, Cloudflare is one of the best WordPress CDN services for your site security and performance. Cloudflare is an extensive CDN network of globally distributed servers.

Q3. How do you add Cloudflare to WordPress?

A: Log in to your WordPress website, Plugins > Add New, and search Cloudflare on the top-right search bar. Install the plugin by clicking on the Install button and then activate it.

Q4. How do I secure my WordPress site with Cloudflare?

A: Connecting your WordPress website with Cloudflare makes your site safe and secure. You can install and activate Cloudflare on your WordPress site, and if you are a Cloudways user, you can integrate Cloudflare from the Cloudways platform.

Q5. Does Cloudflare speed up the WordPress site?

A: Yes, Cloudflare enhances the speed of WordPress sites through its free WordPress plugin. Our tests indicate a 100% improvement in website speed, accompanied by a reduction of 65% in requests and a 60% decrease in bandwidth usage.

Q6. Is Cloudflare a plugin?

A: No, Cloudflare is not a plugin itself. However, Cloudflare provides a free plugin specifically designed for WordPress. This plugin integrates with Cloudflare services, offering features such as accelerated page load speeds, improved SEO, and protection against DDoS attacks and WordPress-specific vulnerabilities.

Share your opinion in the comment section. COMMENT NOW

Share This Article

Danish Naseer

Danish Naseer is a WordPress Community Manager at Cloudways. He is passionate about designing, developing, and engaging with people to help them. He also actively participates in the community to share his knowledge. Besides that, he loves to watch documentaries, traveling and spending time with family. You can contact him at [email protected]

×

Get Our Newsletter
Be the first to get the latest updates and tutorials.

Thankyou for Subscribing Us!

×

Webinar: How to Get 100% Scores on Core Web Vitals

Join Joe Williams & Aleksandar Savkovic on 29th of March, 2021.

Do you like what you read?

Get the Latest Updates

Share Your Feedback

Please insert Content

Thank you for your feedback!

Do you like what you read?

Get the Latest Updates

Share Your Feedback

Please insert Content

Thank you for your feedback!

Want to Experience the Cloudways Platform in Its Full Glory?

Take a FREE guided tour of Cloudways and see for yourself how easily you can manage your server & apps on the leading cloud-hosting platform.

Start my tour

CYBER WEEK SAVINGS

  • 0

    Days

  • 0

    Hours

  • 0

    Mints

  • 0

    Sec

GET OFFER

For 4 Months &
40 Free Migrations

For 4 Months &
40 Free Migrations

Upgrade Now