WordPress CDN Setup with MaxCDN and W3 Total Cache Plugin

WordPress CDN Setup is easy but including the SEO setting? Why is it important? Because people who use CDN, including myself had images de-indexed by Google, the biggest Search Engines at this moment.

In this post we will use MaxCDN with our WordPress website or blog, and W3 Total Cache plugin that has CDN for WordPress setting. Since a few years, I use this plugin, I also voted this to be my best cache plugin I have used. To see all of my best blog plugins, feel free to read the list. Additionally I wrote an error that I had with W3TC and how I managed to fix the issue in this post.

If you haven’t setup CDN yet, I think you need to know that even though CDN can speed up your site, you’ll need to know in advance that there is a possibility your current images will be deindexed from Google images index once you use CDN, if you don’t set it up properly as I mentioned in the first paragraph.

I have used CDN, MaxCDN services about more than a year, and I was happy with speed boost.

But because I recently moved my older website and new host, with fewer post, I think the current host is faster than my previous one, so I stopped using CDN for now.

Preparation Before We Setup MaxCDN

Because I wanted to use custom domains that looks like; cdn.domain.tld cdn2.domain.tld cdn3.domain.tld etc, so you need to access DNS setting on your server. I am using BlueHost in the demo.

If you use HTTPS you will need to have a wildcard SSL certificate to use custom domains

Signup to CDN services, the two that I know is MaxCDN and KeyCDN. I don’t know which one is better service, because I only used MaxCDN, never tried KeyCDN. And this post is not a best CDN for WordPress review, so please do research first, and once you decide MaxCDN, you can follow this tutorial.

WordPress CDN Setup Steps with MaxCDN

1. Login to your MaxCDN dashboard. When this post is published it looks like this;

Click “Create” button, and you will be prompted to add EdgeSSL or close, choose “Close” to close the dialog box that also says, it may take about 2 minutes to propagate your new custom domains.

You will be able to see your Zone’s configuration here. Zone ID, Cluster ID, your WordPress CDN URL, Zone Name, Origin URL, and the label.

Your zone configuration result

4. Now, click on “Settings” tab above, to access Custom Domain Settings. Add your custom domains, mine would be like cdn.wpvidz.com, cdn1.wpvidz.com,..,and cdn3.wpvidz.com. Once you have done this, you will see this;

cdn.yourdomain.tld as custom domain

5. Now, while waiting for the propagation, we can go to your cPanel and look for your DNS Zone Editor. Just search on “DNS” on the search box, and you will see the icon, “DNS Zone Editor” in BlueHost, “Simple Zone Editor” in HostGator, and in many web hosts, it is called, “Simple DNS Zone Editor”.

In HostGator and most web hosts that have cPanel, select your domain, and then you can go to “Add a CNAME Record” section and type cdn.domain.tld on the “name” and your CDN URL on “CNAME” input box. Click “Add CNAME Record”, repeat the steps.

Configuring MaxCDN with W3 Total Cache Plugin

The W3 Total Cache should be installed and activated before following these steps;

1. Hover the “Performance” menu in the right side of your admin dashboard, and click “General Settings“. This will open general settings of W3TC plugin

Performance – General Settings

2. Look for “CDN” section, and check on “Enable” button. Make sure the “CDN Type” in the drop down button is correct accordingly.

Click on “Save all settings” button.

Check enable checkbox

3. You will see a sort of authorization error message that says, “A configuration issue prevents CDN from working: The “Authorization key” and “Replace default hostname with” field(s) cannot be empty. You need to select to select / create a pull zone. Specify it here.

The notification message looks like

4. Go to “CDN” under W3 Total Cache’s “Performance” setting, and while you are still logged in your MaxCDN account, click “Authorize” button next to “Specify account credential” text.

You should now see your “Authorization key”. Click “Copy” button or copy the key characters manually. Go back to your WordPress dashboard and paste your key to the input box next to “Authorization key” and click “Validate” button. You should see “key is valid” highlighted in green color if everything runs well to this point.

Authorize button click to zoom

5. Scroll down, check on the “Replace site’s hostname with” it should be now populated automatically with our settings we created above.

Optional, you can click “Test MaxCDN” button to test. If all is OK, you should see “Test passed”.

Click “Save all settings” button.

6. Clean all your cache, by hovering “Performance” button on the top, and select “Purge All Caches”

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.