How to Setup W3 Total Cache with a CDN (CloudFlare and MaxCDN)

So, I assume you’re here because you already have a website and you want to make it faster. Am I right? Having a fast website is incredibly important for both the experience of your readers and you rankings in the search engines.

According to recent data from Akamai and Gomez.com,“half of web users expect a site to load in 2 seconds or less, and tend to abandon a site that isn’t loaded within 3 seconds.” After that they hit the back button and run along to one of your competitors. So, you’ve only got one chance to woo your visitors with lightening fast loading speeds.

Plus, Google values and ranks websites higher that have fast loading speeds. They’re trying to maximize the user experience for their users (people who use search engines). So, of course they’re going to value websites that load quickly.

Put simply, you can’t afford to have a slow loading website, which is the reason we’ve created this post. Below we’ll show you, step by step, how you can utilize a powerful plugin called W3 Total Cache, and a CDN to give your site the speed boost you deserve.

Benefits of Fast Loading and Website Performance

Did you know that the speed of your website can actually end up affecting your bottom line? If your website powers your business in any way, shape, or form, then you need to take loading time seriously.

Site speed seems like such a small thing to worry about, but it’s incredibly important. Here’s why…

The speed of your site affects things like your bounce rate, your conversions, the number of pages a visitor views, how happy your readers are, and the total amount of time spent on page.

Put simply, having a fast loading site makes your users do the happy dance. Web users are incredibly impatient and we’ve become spoiled by fasting loading speeds. We want things when we want them and that usually means right now. Not five seconds from now.

Plus, when you spend time optimizing your loading speeds you also please the search engines. Google demands that your site loads quickly. They’ve even developed a PageSpeed Insights test, so you can see how your site stacks up. In fact, we recommend running your site though their tool, so you can track loading speeds before and after optimization.

If you think your site loads slowly, then it probably does. You literally have nothing to lose by spending time optimizing your site to perform better. But, how do you do this exactly? Through the tools we’re about to jump into below.

Let’s get to it.

What is W3 Total Cache?

W3 Total Cache is a widely used WordPress plugin. Huge sites like Mashable and even Matt Cutts (of Google fame) himself use this plugin to speed up their sites, so you’ll be in good company. The name sounds a bit technical, so we’ll explain what it actually does.

Put simply, this plugin improves the overall user experience of your site by caching every aspect of your site, improving the performance of your server, and making it easy to integrate with a CDN (we’ll show you how to this below).

Why Does Caching Matter?

Most websites today load in a dynamic fashion, especially if you’re using WordPress. What this plugin does is create a static version of your webpage, so it doesn’t have to be generated from scratch every single time a person visits your website.

This helps to improve server performance, as there are less requests going on, and will greatly reduce page load time, since it doesn’t have to be dynamically created for each session.

This plugin also allows you to generate other cached items as well, such as, your CSS files, Javascript code, and things like images, and your logo. Usually, the browser cache function will last for 24 hours, which is fine, since most of us won’t be updating our site that often anyways.

Lastly, W3 Total Cache integrates with a CDN. A CDN helps to decrease loading time and reduce the overall load on the server. We’ll cover this in more detail in the CDN section below. Installing W3 Total Cache

Are you sold on W3 Total Cache? Good, now we’ll show you how to install it and set it up.

Navigate to Plugins>Add New from your WordPress dashboard, then search for ‘W3 Total Cache’. Look for something that resembles the picture below, and click ‘Install Now’ and ‘Activate’.

Now, the plugin is installed on your site and we can begin setting up the plugin. You’ll notice there’s a ‘Performance’ tab on the left-hand side of your WordPress dashboard, usually towards the bottom. Click on this and you’ll be taken to the plugin’s home screen.

You’ll notice that the main menu screen has a ton of options, but don’t worry we’ll guide you through the basic setup below. In an effort to pare things down we’re only going to focus on some of the more basic settings of the plugins, as it can get pretty technical.

However, the settings we’ll showcase below will be more than enough to get the most speed out of the plugin for those just getting started.

General Settings

On the General Settings page you’ll be able to decide which aspects of the plugin you’ll want to enable across your site.

Preview Mode

The very first selection you’ll see is something called preview mode. When you enable this you’ll be able to test different plugin settings before they’re actually active on the site.

You can turn this on by clicking the ‘Enable’ button.

If messing around with plugin settings makes you nervous that you’re going to break your site, then this is a great way to change settings without the fear of messing up your site. Just make sure you turn off this setting once you’re happy with your settings.

Page Cache

The next section is called Page Cache. By turning on this setting you’ll enable the storing of a static version of your most requested pages. This will reduce the loading time across your site as those pages can be accessed immediately rather than having to wait for WordPress to communicate with your database.

It’s recommended to turn this option on and set the ’Page cache method:’ to ‘Disk: Enhanced’.

Minify

Minify is the process of compressing and removing all unnecessary elements from your CSS, HTML, and Javascript files. However, it’s recommended to test out these features by using the preview option mentioned earlier, so you don’t end up breaking your site.

It’s hard to tell if turning on this feature is going to break your site, or cause a conflict with any other existing plugins, but it’s worth testing out. We recommend enabling this feature and see if it conflicts with any existing site elements.

If it doesn’t, then you’re in the clear. If it does, then simply disable this feature.

Browser Cache

The final feature that’s worth looking at if the Browser Cache. This feature will help to reduce the overall load and number of requests on your server, which will speed up the loading times of your website. We recommend enabling this option.

Other Modules

As you might have noticed there are dozens of other options and features you can enable within this plugin. We decided to only cover the basics here, so we don’t overwhelm you and give you a solid foundation to work from.

Enabling the above settings and integrating the plugin with a CDN (shown below), will be more than enough to speed up the performance of your site. With time you can further tweak and test the additional features of the plugin to unlock new levels of site performance.

What is a CDN?

CDN is short for content delivery network, and it’s a network of servers that can deliver cached content to users based upon their geographic location.

When you’re not using a CDN, anytime a user accesses your website they will be directed towards the actual location of the server. Basically, any visitor to your website will be accessing this single server.

So, if you have a large surge of traffic this can actually overload the server and cause the website to crash. It can also cause your website to load slower if a person is accessing your site from Amsterdam and your server is based in Nevada.

CDNs come to the rescue by storing a cached version of your site across their entire network of servers. This not only helps to spread out the server load, which means the likelihood of a website crash decreases. But, it’ll also speed up the performance of your website.

Before you move forward with setting up a CDN it’s important that you install W3 Total Cache and optimize it according to the steps above. That way we can link the CDN you choose to utilize below to the plugin.

Benefits of Using a CDN

Like we mentioned above using a CDN can have a large impact on your site. We highlight the most common benefits of using a CDN below.

Decreases Site Crashes If you receive a large amount of traffic and aren’t using a CDN there’s a large likelihood your site is going to crash. Especially, if you’re using a basic shared hosting package. A CDN spreads out the server load and makes your site less likely to crash.

Improves Loading Speed A CDN will decrease loading times across your site. Part of this has to do with a visitor being able to access your site using the server that’s in the closest proximity to them.

Better User Experience Internet users love fast loading websites. By using a CDN you’ll speed up your site’s performance which means decreased bounce rates and happier users overall.

Improved Search Engine Rankings Fast websites rank higher and using a CDN will enable your site to do just that.

Below we profile the two most commonly used CDNs and show you how to integrate them with the W3 Total Cache plugin. Cloudflare is a cheaper and more beginner friendly option, while MaxCDN takes a little more technical confidence to setup.

Setting Up Cloudflare

To setup Cloudflare your first need to create an account on their website. Depending on the host you’re using you can actually install Cloudflare using your cPanel. But, for the sake of this tutorial we’ll show you how to set it up using their site.

1. Navigate to Cloudflare.com and click ‘Sign up now!’. A free account will be more than enough for your needs.

2. Once you’ve created an account, then login and you’ll be taken to the dashboard.

Enter your domain name and click ‘Scan DNS Records’. This will usually take about a minute. Once this is completed just click ‘Continue’. Then, scroll down and click ‘Continue’ again, don’t worry about any of the results on the next page.

3. Select the ‘Free’ option and you’ll be taken to a screen that gives you new nameservers. It’ll show you your current nameservers and the new ones created by Cloudflare.

4. Navigate to the registrar where you bought your domain name and then change your existing nameservers to the new ones you just received. It should take a few minutes for the changes to take effect, but there will be no downtime as it switches over.

And that’s it! Your site is now switched over to Cloudflare. However, keep your account open on Cloudflare, because we’ll need it for the next step.

Linking Cloudflare and W3 Total Cache

Navigate back to the W3 Total Cache plugin in your WordPress dashboard. Navigate to Performance>Extensions, then activate Cloudflare and click on Settings.

Enter the email address you used to setup your Cloudflare account and your domain name. The final thing you’ll need to enter on this screen is your API key.

Click on the little blue link that says ‘find it here’ and this will take you to the screen where your API key is located. It can be helpful to open this link in a new tab or window, so you don’t lose any changes you’ve made.

Next, scroll down to the section of your Cloudflare account titled API Key and click on ‘View API Key’. Now just copy and paste that key back into the section labelled ‘API key:’ back in the plugin’s dashboard and you’re all set.

Congratulations, now you’ve successfully linked both accounts and you can say hello to faster site speeds.

Setting Up MaxCDN

If you’re looking to take your CDN integration even further, then you can give MaxCDN a go. Note, there isn’t a free version of MaxCDN available. So, you’ll need to sign up if you want to use this service.

Once you’ve created your MaxCDN account it’s time to integrate it. To get started follow the steps below.

1. Create a Pull Zone

In your MaxCDN dashboard click on ‘Zones’, then ‘+Create Pull Zone’.

First, enter the name of your pull zone. Second, enter the URL where you originally installed WordPress. So, if you installed WordPress in a subfolder, then you’ll need to use that. Third, you’ll need to enter a label that will help you keep track of the pull zone.

Once you’ve entered those details, then click on ‘+Create’. This will usually take a few minutes to create. Once it’s created you’ll be taken to a screen that shows all of the Zone Configuration information.

You’ll want to keep this screen open, and take special note of your CDN URL.

2. Authorize and Connect MaxCDN

Go back to your WordPress dashboard and navigate to Performance>CDN. This will take you to the page where you can link the two accounts together.

Now, scroll down until you see a section titled ‘Configuration’ and click on ‘Authorize’, as shown in the image below.

This will create an authorization key for you to use. Copy and paste that code into the ‘Authorization key:’ box.

Click on ‘Save Settings’ and the screen will refresh. We need to do one final thing before the accounts are linked.

The final thing you’ll need to do is configure the pull zone you created earlier.

You’ll want to select the pull zone you created earlier, and replace the site’s hostname with the CDN URL from the first step (if it’s not in the box already). Then click ‘Save all settings’ and you’re all set.

You’ve now successfully linked MaxCDN and and W3 Total Cache.

In Closing

Hopefully you know by now that having a website that loads fast is incredibly important. The future of your business might depend on it! We hope the tutorial above has helped you easily link together W3 Total Cache and the CDn of your choosing.

Over time, you can further optimize your site by further tweaking and testing different settings. But, even following the simple tutorial above will be enough to ensure your site is in the upper echelon of website loading speeds.

But, before we wrap things up completely, let’s see just how fast your current website is loading. Open up a tool like Google PageInsights, GTMetrix, or Pingdom and enter your site’s URL.

These tools will then test your loading speeds and give you a grade. Hopefully, you’ll see a massive improvement from the test we encouraged you to run back in the introduction.