W3 Total Cache Setup with advanced features needs a bit experience. This is guide on how to set up W3 Total Cache with CloudFlare, Google Page Speed API and CDN service. (Updated on 28th November 2016 ) New version of W3 Total Cache with WordPress Version 4.6.1 or above will need to activate CloudFlare extension from WordPress Dashboard’s Performance > Extensions > CloudFlare [Click activate] for API based settings :
Basic Settings for W3 Total Cache
In this tutorial, we will NOT discuss about the Basic Settings for W3 Total Cache. Zemalf has written excellent step by step tutorial and ebook for these Basic as well as Common Settings for W3 Total Cache Plugin.Though the tutorial on W3 Total Cache is written for older version, the basic settings will remain the same for newest version.
We will Discuss only how to set up and configure W3 Total Cache Plugin with CloudFlare and any type of CDN.
How to Setup CloudFlare account and Configure W3 Total Cache
First you need to sign up for a CloudFlare account from here. By this time, we are assuming that, you have installed the latest version of W3 Total Cache Plugin and has activated it. Go to Performance (W3 Total Cache Plugin shows as Performance) > General Settings page. Scroll down to “Network Performance & Security powered by CloudFlare” options in W3 Total Cache, Tick mark the Enable option :
If you want to integrate CloudFlare with W3 Total Cache Plugin, then use your CloudFlare account email and click the link for API key and copy paste it in W3 Total Cache options page. This step is optional. Those who will update their websites 6-8 hourly, they need this feature to clear the CloudFlare Cache from WordPress Dashboard via API. Those who will not update their websites even weekly hourly, they need not to use this feature as they can clear the CloudFlare Cache from CloudFlare’s account. You must have to add your website in the CloudFlare account :
And follow the steps. In the mean time, download this Plugin named CloudFlare WordPress Plugin from WordPress, install and activate it. It has also similar option like W3 Total Cache’s field to put your API and email.
After You have Activated the CloudFlare Plugin, again go to your online CloudFlare account, you will guided by a wizard and finally CloudFlare will provide you a new set of Name-Servers. You have to login to your Domain Registar account (not server’s cPanel) and change the name servers to the provided by CloudFlare.
Within few minutes, your DNS will be redirected without interruption. You can use other apps provided by CloudFlare too.
Clear your W3 Total Cache and it is ready to get boosted by CloudFlare.
NOTE : Do not use CloudFlare’s minify and W3 Total Cache Minify settings together. Why, that is written in official guide of CloudFlare.
Setup of Google Page Speed API
Again, go to to Performance (W3 Total Cache Plugin shows as Performance) > General Settings page. Scroll down to “Object Cache” options, Tick mark the Enable option. Scroll down and enter your Google Page Speed app’s API in the “Miscellaneous” field of W3 Total Cache. It will give you the feedback of performance on your Dashboard.
Setup of CDN in W3 Total Cache
CDN (content delivery network) CDN can be a separate service. You can use a origin pull, origin push or ftp CDN with W3 Total Cache. However, do not use your subdomain as CDN, that is a malpractice. Simply activate the right type of CDN from the General Settings page of W3 Total Cache and then go to CDN option of W3 Total Cache and tick the folders you want to use the CDN for. As the settings will vary according to your subscription / allotted bandwidth, you might ask W3 Total Cache team for if you need so. CloudFlare with W3 Total Cache without own CDN :
We advice to test KeyCDN for WordPress as CDN as it is cheaper, easy, feature rich and has 1 month free trial. You can read our basic guide for KeyCDN with WordPress (it is mainly for non-HTTPS websites). Now, we have guides for configuring WP Super Cache with origin pull or origin Push CDN, troubleshooting guide like Fix CDN not working with W3 Total Cache. Fonts need special consideration with W3 Total Cache, HTTPS and CDN.Tagged With cloudflare cache , cloudflare and w3 total cache , E28X , Network Performance by Cloudfare w3 total cache , SET UP W3 TOTAL , setting up w3 total cache , setup cdn cloudflare with w3 , w3 total cache setup with cloudflare
Alexandre Plennevaux says
Thanks for this really interesting and clear article. One point is not clear to me: Isn’t Cloudflare a CDN service? Why then use both Cloudflare and the CDN functionality of W3TC ? It seems to me Cloudflare is enough.
Thank you very much for the appreciations.
Yes, CloudFlare (The Free service) is definitely a CDN and it hosts minified static files. But it does not host post thumbnails for example or other image files or audio/videos. For that part, we need to leverage with a CDN. May be using the Premium feature of CloudFlare “Prefetch” will leverage more.
You can view a test here, this website is using CloudFlare + CDN : http://www.webpagetest.org/result/110815_CE_1ATF8/1/performance_optimization/#use_of_cdn
But the CDN is actually not recognized by WebPageTest, only ss6.speedymirror.com is recognized as cdn. Compare with only CloudFlare (this blog) : http://www.webpagetest.org/result/110813_1F_1ADGQ/1/details/
1. The first site has issue with both the server’s DNS lookup time and a bad CDN setup.
2. Second case, our blog: imagine if our blog’s image parts are loaded from a cdn with performance like CloudFlare. You can see the image parts are loading from our server, after 1 second. For example look at Request 9. If was delivered from a good CDN, it would start within 0.6 seconds. It is possible to make it <1.5 seconds with proper setup.
Dunia Maklumat says
yes.. I already try n good and performance, Thanks..
Thanks for this man ;) great tutorial!!
You are welcome.
Thank you very much for the appreciation.
This guide on W3 Total Cache Setup with CloudFlare and CDN is thankfully listed in official plugin’s webpage (in Other Notes in WordPress repository of W3 Total Cache Plugin) by the plugin developer. I hope this and other guides will help many adaptive users.
dat helps a lot
i was confused in w3total cache and WP super cache
but stuff is now clear enough
thanks to u
digital advertising agencies in mumbai says
Useful information. Fortunate me I discovered your site unintentionally, and
I am surprised why this coincidence did not happened earlier!