How to setup a CDN in WordPress Using WP Super Cache

Why use a CDN on your blog?

A CDN (content distribution network) is useful for speeding up your website’s load time for your visitors, particularly users located far from your website’s server’s physical site. What it does is store your images, JavaScript & CSS files on locations throughout the world so they load faster via the closest POP (point of presence) site. This also helps reduce the amount of bandwidth your server uses. CDN service is relatively inexpensive and adds a lot of value, plus it’s easy to do, so why not do it? Anyone that takes their website seriously should use a CDN. If you take your website seriously and it runs on WordPress, here’s an easy guide on how to set one up.

Steps to Setup a CDN in WordPress

1. Purchase CDN services from MaxCDN.
2. Log in to your new MaxCDN account and create a new Pull Zone for your website.
3. Setup a custom domain for your Pull Zone, we recommend using a subdomain (i.e. our cdn custom domain is penguininitiatives.com).
   

   ---

   

   ---

4. Copy the Temporary URL of your Pull Zone, which can be seen on the summary page for your Pull Zone in MaxCDN like in the following screenshot:
   

   ---

   

   ---

5. Add a CNAME record to your DNS records for your site’s domain name. Set the sub-domain to “cdn” and for the IP Address/URL enter your Pull Zone’s temporary URL like in the following screenshot:
   

   ---

   

   ---

6. Install & activate the WP Super Cache WordPress caching plugin.
7. In your WordPress Dashboard go to Settings > WP Super Cache > CDN
8. Check the Enable CDN Support check box and enter your Pull Zone’s custom sub-domain in the Off-site URL field, make sure to leave out the trailing slash. If your site is exclusively http and never uses https then check the Skip https URLs to avoid “mixed content” errors check box as well. Finally hit “Save Changes”. Your WP Super Cache settings will then look like the following:
   

   ---

   

   ---

9. If you have caching enabled, make sure to then clear your cache. You should now see your website images, JavaScript & CSS files being loaded from the custom CDN sub-domain instead of your web server.

Don’t Forget to Clear Your Cache & Purge Your CDN Files

Note that when you make an update to your images, JavaScript or CSS files going forward you’ll need to first clear your cache (if you have caching enabled – which I don’t know why you wouldn’t) and then purge the files via MaxCDN to see the changes reflected on your website. If you make more than just a couple of quick changes I would recommend disabling both caching and CDN until you’ve completed them.