In order to improve connections for users from all over the world, Ghacks enabled a content delivery network (CDN) yesterday.
A CDN basically stores files and information on mirror servers all around the world in order to serve data to users from locations closest to them.
This speeds up the connection process noticeably. In its simplest form a content delivery network is nothing more than additional servers that are serving data necessary to access the website.
The first part of this tutorial describes how to use a content delivery network in WordPress. It details the requirements needed to install the CDN properly. The second part will cover the configuration of the CDN in WordPress.
WordPress does not have options to enable a CDN, however plugins and third party tools can be used to enable that functionality. Here are the scripts and services needed to configure the content delivery network as we did here at ghacks.net:
We have selected Amazon Cloudfront as our content delivery network. It may not be the cheapest available, especially for webmasters with low traffic websites, but it is easy to configure and maintain with the help of the W3 Total Cache plugin.
The first thing that system administrators need to do is to create an Amazon S3 account. It can take several hours before the account becomes activated. In the meantime, the system admin can install the WordPress plugin W3 Total Cache and verify that the blog is working as it should be.
Although we only concentrate on the CDN configuration in this article and not the caching configuration, you may want to configure the caching as best as you can. Retrieve the access key and secret key from the Security Credentials page once it has been activated. Make sure the status is set to active there.
Open the WordPress settings, switch to the W3 Total Cache configuration and change the CDN network to Amazon Cloudfront.
Do not enable the CDN yet. Now switch to CDN settings and enter the access key and secret key in the settings. A bucket needs to be created in the next step, which is basically a folder on the Amazon Cloudfront network.
As this did not work for us from within WordPress, we used the Firefox add-on Amazon S3 Firefox Organizer to create the bucket. If you have used a third party tool to create the bucket then enter it's name in the bucket field now.
Now switch to the AWS Management Console and create a new distribution. Select the bucket that has been created earlier as the origin and enter a CNAME that you plan to us for the CDN.
This is necessary if you want your users to see a URL such as cdn.yourdomain.com instead of dx7ffewrewr.cloudfront.com when connecting to your website. You can pick any CNAME you want at this stage. Keep all the other parameters in their original state.
The new distribution should appear in the listing. It is ready when the status reads enabled and the state deployed.
Switch to your web host or server now. We need to create the new CNAME for the CDN. We are going to show you how it is done if the domain is hosted at Godaddy.
Update: Godaddy recently changed it homepage to a new design and layout. The functionality provided is still available, but in different places.
Once you have signed in to your account, you need to click on Domains to display the list of domains. There you need to find the domain and click on manage to open its control panel.
Switch to DNS-Zone on the page that opens and select the add record option. Pick CNAME (Alias), enter dns under host and the cloudfront domain under points to. End
Log into your Godaddy account and click on Domain Manager once the overview page has loaded. This is the page that is displayed after login. Click on the D icon next to the domain name that you want to configure the CDN for. This opens the dashboard for that domain. Select More Settings and click on the Manage button next to the Total DNS / MX entry. Select to Add a new CNAME and enter the same name that you selected during the distribution creation in the AWS Management Console. If you followed our example it would be cdn.
Enter the domain name shown in the distribution console in the Points To Host Name field. This will basically redirect requests to cdn.domainname.com to the Cloudfront url.
It takes some time before the redirection becomes active. You can use this tool to check if the CNAME is active.
Enter the cloudfront domain name and the CNAME in the CDN configuration in the WordPress blog. Save the settings before continuing.
So far we have performed the following steps:
Once this has been done, it is time to test the configuration by clicking on the Test S3 Upload button. If this returns that everything is running fine then you are ready for the final step. If not, you need to retrace the steps done so far to find the problem.
If the upload test was successful then you are ready to transfer data to the CDN. Now transfer your media library, include files, theme files, minify files and custom files to the CDN. This is done in the WordPress admin interface. Depending on the amount of data that needs to be transferred, this can take some time.
Switch to the General Settings tab once all the data has been transferred to the CDN. Place a checkmark in the Enable CDN box to activate the content delivery network. You should now test the blog to see if everything is up and running as it should be. This includes accessing various blog pages, leaving comments and using proxies to connect from other locations around the world.
It takes between one and six hours to configure and activate a CDN on the WordPress blog. Most of the time is spent waiting for the DNS to propagate, the account to become active and the data to be transferred. Webmasters should check the speed of their website in Google Webmaster Tools (or other tool) to see if the changes have decreased the load time for the users of the site. They should also monitor the costs over at Amazon.
Advertising revenue is falling fast across the Internet, and independently-run sites like Ghacks are hit hardest by it. The advertising model in its current form is coming to an end, and we have to find other ways to continue operating this site.
We are committed to keeping our content free and independent, which means no paywalls, no sponsored posts, no annoying ad formats (video ads) or subscription fees.
If you like our content, and would like to help, please consider making a contribution:
Ghacks is a technology news blog that was founded in 2005 by Martin Brinkmann. It has since then become one of the most popular tech news sites on the Internet with five authors and regular contributions from freelance writers.