Last updated on

What is CloudFlare?

CloudFlare is one of the biggest networks in the world, having over 200 data center locations. It is  used by millions of website owners around the world, and can provide several benefits to you as a website owner as well. Their mission is very much like ours here at BoldGrid, to help improve the internet and even more so, help speed up the web.

Since 2011, W3 Total Cache and CloudFlare have been fully integrated for WordPress using the extension framework. The following WordPress tutorial will walk you through the steps needed to set up CloudFlare, and enable CloudFlare for WordPress within your Dashboard using W3TC.

Registering a Cloudflare account

To get started, you need to register an account with CloudFlare. Once that has been completed, you can begin adding your site. If you already have an account, you just need to login.

After you’ve created an account you need to add the website by clicking on + add a site.

Image showing the CloudFlare Interface

 

To complete this step, you need to enter your website’s domain name, and click on add site to continue.

Adding your domain in CloudFlare

After this you will be prompted to another page to select your plan. Select your plan and confirm it. We recommend beginning with the free plan, as you can upgrade later anytime you decide.

An image to outline the process of selecting a plan for CloudFlare

Once you have confirmed the plan, Cloudflare will begin scanning for existing DNS records. Once that has been completed, you will be taken  to another page to Review your DNS records. If you are unsure of the accuracy, it is recommended to confirm these DNS records with your web host.

An image of the results shown after a CloudFlare DNS scan

Next, you will need to change your domain nameservers. This can be done with the company who you have registered your domain with directly. Pointing to Cloudflare’s nameservers is critical for enabling CloudFlare for your WordPress website. Otherwise, Cloudflare is unable to manage your DNS and serve your website from their Content Delivery Network.

If you need assistance with changing your domain nameservers, we would recommend contacting your registrar’s support directly. Note that it may take anywhere from 1 to 24 hours for the changes to take effect completely. But don’t worry – your site should not experience any downtime.

CloudFlare nameserver information

Activating Cloudflare in W3 Total Cache

 

Next, to ensure that WordPress is configured optimally for CloudFlare, you will need to activate the Cloudflare extension.

  • In the WordPress Dashboard, Navigate to Performance → Extensions
  • Click on Activate under Cloudflare.

Showing how to activate the CloudFlare extension in W3 Total Cache

After the extension is activated click on the Settings to authorize the Cloudflare credentials.

Showing how to configure CloudFlare in W3 Total Cache

Click on the Authorize to enter the email address for your Cloudflare account as well as your Cloudflare API key.

Showing how to enter your email and API Key for CloudFlare in W3 Total Cache

*Note that the Authorize button may not work if your Dashboard is in the language other than English. If you are experiencing any issues, please set the language to English temporarily to Authorize Cloudflare.

You can find your Cloudflare API key by going to My Account and finding the API Token section.

After clicking on the “next” button you will be prompted to select the zone. Click on the radio button next to your site and confirm:

Here is where you select the domain you set up in CloudFlare

Congratulations, Cloudflare is now activated. Note that if you’ve activated Cloudflare before confirming the DNS records changes it may not have an effect until DNS Propagation has completed.

WordPress CloudFlare Minify Settings

To ensure you do not have a conflict, you need to configure minify to work in either W3 Total Cache or CloudFlare. Since both methods have a different approach, they do not work well together. This includes HTML minify, Javascript minify, and CSS minification settings.

Changing CloudFlare Configuration Settings

When adjusting the CloudFlare configuration in W3 Total Cache, or purging the CloudFlare Cache, it is possible that it may take up to 24 hours for your cache to fully rebuild.

If you need assistance with configuring CloudFlare for WordPress, and wish to have our Eneterprise Level Support Team assist  you, you can navigate in the WordPress Dashboard to Performance → Support and submit a plugin configuration request. It will require access to your domain registrar, WordPress Dashboard and CloudFlare account. Learn more about our W3 Total Cache Premium Support Services.

W3 Total Cache

You haven't seen fast until you've tried PRO

   Full Site CDN + Additional Caching Options
   Advanced Caching Statistics, Purge Logs and More

Everything you need to scale your WordPress Website and improve your PageSpeed.

8 thoughts on “How to Configure Cloudflare in WordPress with W3 Total Cache

  1. Hi Jesse, thank you for your tutorial. 🙂

    I have followed your guide until generating API Key on Cloudflare (in this case, I generate Global API Key). When I input the API Global API key on the Authorize button on Cloudflare extension and click Next.

    The select zone box doesn’t show zone like on your tutorial. So the display on my box like Zone: (empty), then if I click Next, I can’t authorize successfully, it will keep redirecting me to that zone box again, so I can’t get it done. Is there anything wrong in this case? really appreciate for your time, looking forward to hearing from you.

    • Hello Juherianto,

      As I’ve mentioned in the reply via the support channel, his means that the zone is not available. So you need to make sure that the DNS propagation is finished, meaning that the DNS is now pointing to Cloudflare. Once the propagation is done and the DNS settings updated, the zone should be available in the authorization.

      Thanks!

  2. Hi Jesse, great article!
    I already have my site running with Total Cache and Cloudflare, but Im having an issue with the cache and new content, Im running a newspaper site so new posts are frequently added, and this posts are not visible on the site (mostly on category pages)
    I’ve installed the Cloudflare plugin and activated the Auto purge content on update (not using APO).
    Does anyone have this scenario? Any suggestions?

    Thank you

    • Hi Ernest-

      If you enable the Cloudflare Extension in Performance > Extensions, you won’t need to also run the Cloudflare plugin, all of the same purging functionality will be handled by W3TC.
      Do you have any other caching enabled, like a proxy cache with NGINX, that may also need to be purged when you make updates?
      You can also start a new Support Forum thread if you’d like to provide some more details for us to take a look at.

  3. Good day, how does this process work on a WPMU installation with distinct domains – where each domain is already registered and activated in CF as well.

    • Hi Munya-
      In order to accomplish that, you should disable the option to Use single network configuration file for all sites in the Performance > General Settings > Miscellaneous section of your menu as your network super-administrator, and then enable and configure the Cloudflare extension on each individual site.

      • Hi Jesse,

        Thanks for getting back to me.

        I have tried the setup as you describe & all the sites are inheriting the clouflare site of the network / primary installation.

        I have disabled the extension for now and will manually manage the sites on cloudflare for now. The main feature on the extension that I love is purging the cloudflare cache on page / post change

        • Hi Munya-
          As long as you’ve disabled the Use single network configuration file for all sites option, your network sites should be able to use their own settings for the CloudFlare extension. If that’s not working for you, we’ll be happy to assist. Start a new support forum thread with the details of your configuration, and we’ll be able to help troubleshoot for you.

Leave a Reply

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