The earlier released video is still available here on Youtube. It only describes the basic set-up though. In the mean time I completely rewrote this blogpost (and had it reviewed and approved by MaxCDN!). It now describes in great detail how to set up MaxCDN with Joomla, using the NoNumber plugin CDN for Joomla. Next to the basics, it also describes how to set up a custom domain, and optimize the SEO settings.
Before you start, it is alwys nice to record your current sitespeed using a tool like Pingdom Tools or Google Pagespeed, so you can compare the before and after situation.
1: Sign up for MaxCDN
First, sign up for a MaxCDN account (you can sign up with a discount here). Then, from the console, click on Zones in the menu. You can set-up multiple types of zones, but for the plugin we will be using we need Pull Zones, which is the first option available anyhow. Then click on Create a Pull Zone. This will open a screen where we can start filling in the data for your website.
There are just a few parameters to fill in:
- Pull Zone Name: Just a short name, related to your site
- Origin server URL: The full URL of your website, inluding the http://
- Compression: This switches on G-zip compression for the content on the CDN, switch it on.
There are optional parameters to set a "Custom CDN Domain", but first, we don not fill it in. So, just click the Create button. This will now create the pull zone, while also "pulling" all available static content / files from your website to the CDN servers around the world.
Once you have finished, a CDN URL will be created in your overview, like xxxxxxxxx.netdna-cdn.com". This is what you need for the Joomla plugin.
If you want, you can also add more advanced parameters for caching, hotlinking, etc., but these settings are all optional.
2: NoNumber plugin "CDN for Joomla"
Now the easiest way to configure your website to use the CDN is to download the NoNumber CDN for Joomla plugin. I used the Pro-version, but the free version works just as well for most sites. Set-up is really easy:
Install the plugin, go to the Plugin Manager and look up System - NoNumber CDN for Joomla!.
The only thing you have to do is to fill in the earlier recorded CDN URL. You can finetune which files you actually want to be loaded from the CDN, but I usually leave these at their defaults, unless I encounter issues. Now save the parameters, and check if you see any speed improvements. My website already loaded pretty quick, but checking Pingdom Tools it seemed I gained another 25% through the CDN. MaxCDN also has a basic tutorial
3: Advanced configuration: custom CDN domain
In many cases, you do not need to go any further, but there may be cases where more advanced configuration is necessary. The reason could be that you want a cleaner URL:
- Current URL for images: http://cdn-url-xxxxx.netdna-cdn.com/images/xxxxxx
- Custom CDN domain URL: cdn.website.com/images/xxxxx
For SEO purposes, this might be better, because the images are now served from a subdomain of your own website, instead of the remote CDN. Google certainly prefers this. So, let's set this up. First, we need to set this in the MaxCDN settings. Go to Settings and for Custom Domains specify a subdomain that you would like to use, including your website domain:
This will create the configuration on the CDN side. However, you will also have to configure it on the host-side. Most of you will use a Cpanel, which makes this pretty easy, but you should be able to achieve this with any other tool provided by your hosting company.
From the Cpanel dashboarrd, go to the Simple DNS Zone Editor:
Now use the settings from MaxCDN to create a CNAME record. First, fill in the desired subdmain (icluding the domain name), and secondly, fill in the full URL as you found it in the MacCDN settings:
4: Update the plugin settings
Once the CNAME is created, both the CDN and your host are set correctly. As the last step, you need to tell Joomla that the location of the CDN has changed. So, go to the Plugin Manager again and look up the CDN for Joomla plugin from NoNumber, and update the setting for the CDN Domain to use the custom domain (in my example cdn.joomlaseo.com).
Well, that's it, a custom domain for your CDN, with clean URLs for your images!
But: if you want it to be perfect, there is till some work to do......
5: SEO settings on the MaxCDN side
On the MaxCDN side, there are some SEO settings as well. The problem could be that Google now finds assets (mainly images) on 2 locations: your site, and the CDN, which is basically a copy of your site. The SEO settings ensure that Google knows there are duplicates, but also it is informed that it should only use 1.
By default, nothing is checked here, but make sure you check them both:
- Canonical Header: This feature adds a HTTP header to your CDN assets to tell Google where the original file is hosted. This helps your site avoid duplicate content issues.
- Robots.txt: This feature adds a robots.txt file to the root directory, specific for the CDN, to disallow page crawl by search engines like Google.
- Custom Robots.txt: This needs to be exactly like the robots.txt file in the root of your site, they should be the same.
As a result of all this, the images will be indexed from the CDN side.
6: Update your sitemap!
If you used an image sitemap already, make sure the image sitemap now uses the CDN domain as it's source, and not the images folder of your actual domain! If you use a Sitemap extension, it should populate it with the correct URL's. I use JSitemap, and it updated correctly indeed, but if you use another extension, or create it manually, check it out. URLs in the image sitemap should be someting like this now:
7: Verify the custom domain in your webmaster tools account
The last step: to inform Google that you truly own the subdomain, make sure you verify it in your Google Webmaster Tools account. This should be a 2 second step: If you have verified your current site using an HTML verification file, this file will also have been propagated to the CDN, so there is no need to re-upload it. So, simply ask Google to verify your new domain, and it will be verified.
And that should be it.....
Note that it took me quite a while to figure all this out, so if you have any better ideas, please let me know. I used these references to help me out: