W3 Total Cache (W3TC) is one of the top notch caching plugins for your WordPress site. It will help you to do caching and minification out of the box with CDN support from popular services. On other hand, Cloudflare is the free CDN offered with most of the hosting companies like Bluehost and SiteGround. It is a good idea to combine the power of caching and CDN to improve the speed of your site. In this article let us discuss how to connect Cloudflare CDN with W3TC in WordPress site.
What You Need?
You need the following things in order to connect Cloudflare and W3TC:
- Admin access to WordPress admin panel.
- W3 Total Cache plugin installed on your site. Check out our article on how to setup W3 Total Cache on your site.
- Free or premium Cloudflare account.
How to Connect Cloudflare CDN and W3TC in WordPress?
W3 Total Cache does not offer any default settings for Cloudflare CDN setup. In fact it recommends StackPath’s MaxCDN which is another popular CDN option for WordPress users. You have to enable an extension in W3TC, in order to use Cloudflare.
Installing Cloudflare Extension
Login to your WordPress admin panel and navigate to “Performance > Extensions” section. Here, you will find all available extensions for W3TC and activate the Cloudflare extension.
Once activated, click on the “Settings” link to go to Cloudflare settings. First you should connect your Cloudflare account with W3TC and authenticate the connection.
Click on the “Authorize” button and you will be prompted to enter the API key from your Cloudflare account.
Get API Key in Cloudflare Account
Login to your Cloudflare account and navigate to your account settings. Scroll down to “API Key” section and click on the “View API Key” button against “Global API Key“. Copy the API key into clipboard.
Connecting Cloudflare and W3TC
Now go back to WordPress admin panel and enter the API key in the W3TC authorization box.
Click “Next” button and you should see the zone as your domain name activated in Cloudflare account.
Now that you have successfully connected Cloudflare and W3TC. Click on the “Next” button to go to the complete settings page.
Configuring CDN Setup
All your existing settings from Cloudflare should appear by default. You will also have additional settings from W3TC to optimize the caching. Here we will show some important settings you should be aware of.
General Settings
Under “General” section, you can enable the cache time and page cache options. Cache time is the time in minutes the Cloudflare date should be stored in W3TC cache. Page cache option allows you to flush the Cloudflare cache whenever the page content is changed on your site.
Caching Settings
Under “Cloudflare: Caching” section, you can configure the caching level, browser cache time and other options.
Content Processing Settings
Under “Cloudflare: Content Processing” section, you can enable minification of HTML, JS and CSS resources. The other important option is to enable “Rocket Loader“. This is a performance booster to load JavaScript files asynchronously to improve the page loading speed.
SSL Settings
Nowadays, all hosting companies like SiteGround offer Let’s Encrypt SSL pre-installed on WordPress installations. SSL setup in Cloudflare account and hosting account may interfere and create problems. Therefore, ensure to setup correct SSL settings here. Also. only premium account holders are allowed to set the SSL level from W3TC settings even your host support SSL with Cloudflare.
Save all your changes once the configuration settings are completed. Remember Cloudflare works like a mediator between your server and the user. Activating Cloudflare needs DNS changes which may take up to 48 hours to propagate properly. Especially, DNS propagation with Cloudflare will take long time for sites with SSL certificates. Your site will down till the time the DNS changes are completely propagated.
Final Words
Though there are many CDN services are available for WordPress, Cloudflare is one of the easy solutions. It is available free with many hosting plans and the setup is very easy. You need to change the nameservers and link your account in plugins like W3 Total Cache. You can configure all settings from the plugin and increase your site’s content delivery.
