FAQ: CDN
Technically no, a CDN is a high-performance cache that stores static assets (your theme files, media library, etc.) in various locations throughout the world in order to provide low-latency access to them by readers in those regions.
First create an S3 account (unless using origin pull); it may take several hours for your account credentials to be functional. Next, you need to obtain your "Access key ID" and "Secret key" from the "Access Credentials" section of the "Security Credentials" page of "My Account." Make sure the status is "active." Next, make sure that "Amazon Simple Storage Service (Amazon S3)" is the selected "CDN type" on the "General Settings" tab, then save the changes. Now on the "Content Delivery Network Settings" tab enter your "Access key," "Secret key" and enter a name (avoid special characters and spaces) for your bucket in the "Create a bucket" field by clicking the button of the same name. If using an existing bucket simply specify the bucket name in the "Bucket" field. Click the "Test S3 Upload" button and make sure that the test is successful, if not check your settings and try again. Save your settings.
Unless you wish to use CloudFront, you're almost done, skip to the next paragraph if you're using CloudFront. Go to the "General Settings" tab, click the "Enable" checkbox, and save the settings to enable CDN functionality. Empty the cache for the changes to take effect. If preview mode is active you will need to "deploy" your changes for them to take effect.
To use CloudFront, perform all of the steps above, except select the "Amazon CloudFront" "CDN type" in the "Content Delivery Network" section of the "General Settings" tab. When creating a new bucket, the distribution ID will automatically be populated. Otherwise, proceed to the AWS Management Console and create a new distribution: select the S3 Bucket you created earlier as the "Origin," enter a CNAME if you wish to add one or more to your DNS Zone. Make sure that "Distribution Status" is deployed and "State" is enabled. Now on the "Content Delivery Network" tab of the plugin, copy the subdomain found in the AWS Management Console and enter the CNAME used for the distribution in the "CNAME" field.
You may optionally, specify up to 10 hostnames to use rather than the default hostname, doing so will improve the render performance of your site's pages. Additional hostnames should also be specified in the settings for the distribution you're using in the AWS Management Console.
Now go to the General tab, click the "Enable" checkbox, save the settings to enable CDN functionality, and empty the cache for the changes to take effect. If preview mode is active you will need to "deploy" your changes for them to take effect.
Anything I need to do when using Amazon Web Services with limited permissions (S3, CloudFront, SNS)?
We recommend that you use IAM to create a new policy for AWS services that have limited permissions. A helpful tool: AWS Policy Generator
You also find an S3 configuration sample in the "ini" folder in the plugins directory.
First create an account. Next, in the "Content Delivery Network" section of the "General Settings" tab, select Rackspace Cloud Files as the "CDN Type." Now, in the "Configuration" section of the "Content Delivery Network" tab, enter the "Username" and "API key" associated with your account (found in the API Access section of the rackspace cloud control panel) in the respective fields. Next, enter a name for the container to use (avoid special characters and spaces). If the operation is successful, the container's ID will automatically appear in the "Replace site's hostname with" field. You may optionally, specify the container name and container ID of an existing container if you wish. Click the "Test Cloud Files Upload" button and make sure that the test is successful, if not check your settings and try again. Save your settings. You're now ready to export your media library, theme, and any other files to the CDN.
You may optionally, specify up to 10 hostnames to use rather than the default hostname, doing so will improve the render performance of your site's pages.
Now go to the General tab, click the "Enable" checkbox, save the settings to enable CDN functionality, and empty the cache for the changes to take effect. If preview mode is active you will need to "deploy" your changes for them to take effect.
Login to your CDN provider's control panel or account management area. Following any setup steps they provide, create a new "pull zone" or "bucket" for your site's domain name. If there's a setup wizard or any troubleshooting tips your provider offers, be sure to review them. In the "Content Delivery Network" tab of the plugin, enter the hostname your CDN provider provided in the "replace site's hostname with" field. You should always do a quick check by opening a test file from the CDN hostname, e.g. http://cdn.domain.com/favicon.ico. Troubleshoot with your CDN provider until this test is successful.
Now go to the "General" tab, click the checkbox, save the settings to enable CDN functionality, and empty the cache for the changes to take effect.
If the file exists in your document root (i.e. http://domain.com/favicon.ico), the plugin can take care of that for you using custom upload options. If the file is in your theme directory you can also have the plugin uploaded from there.
Yes, you can specify which file types you would like served by CDN and they will be uploaded and always downloaded from that location. This includes the smilies, JavaScript files et al. By default, we take care of them all.
Yes, any CSS and JS you manage with the plugin are minified before being uploaded to your CDN. You don't have to make any special changes to your theme. We encourage you to make sure that your provider supports HTTP compression as the benefit of having your static assets available from more than one POP alone is not enough.
That depends on how you use your blog and where most of your readers read your blog (regionally). Here's a short list:
No, that is taken care of for you. Your CSS files will originate from your CDN provider and all paths to any images in your CSS will be changed from relative to absolute, making sure that they load just fine. Do nothing differently, yet reap all the benefits.
The media library import tool is for old or "messy" WordPress installations that have attachments (images etc. in posts or pages) scattered about the web server or "hot-linked" to 3rd party sites instead of properly using the media library.
The tool will scan your posts and pages for the cases above and copy them to your media library, update your posts to use the link addresses, and produce a .htaccess file containing the list of permanent redirects, so search engines can find the files in their new location.
You should perform a backup of your database before performing this operation.
If the domain name of your site has changed, this tool is useful in updating your posts and pages to use the current addresses. For example, if your site used to be www.domain.com, and you decided to change it to domain.com, the result would either be many "broken" images or many unnecessary redirects (which slow down the visitor's browsing experience). You can use this tool to correct this and similar cases. Correcting the URLs of your images also allows the plugin to do a better job of determining which images are actually hosted with the CDN
As always, it never hurts to back up your database first.
- Select the CDN provider of your choice in a "Full site mirroring" group of the "CDN type" dropdown on the "General Settings" page, and select MaxCDN there.
- Go to the "CDN" page.
- Click the "Authorize" button
- Type in the API key of your account. You can obtain it by following a link in a popup. When opening that link, you will be prompted for your MaxCDN login and password. Select Zone from the list or choose "Add new" to create a new zone (type in some friendly name of the zone in that case)
- In a zone setup form you will be notified of the settings required for the zone. You have only one editable field is IP address of your WordPress host. W3 Total Cache tries to guess it, but it's not possible to know that in all possible cases.
- You get a success page with information about DNS changes. Now you need to change the record of your WordPress host from the IP address and replace it with the CNAME of the specified hostname.
- It works.
- Select the CDN provider of your choice in a "Full site mirroring" group of the "CDN type" dropdown on the "General Settings" page, and select CloudFront there.
- Go to the "CDN" page.
- Click the "Authorize" button
- Type in the Access Key and Secret Key of your account.
- Select Distribution from the list or choose "Add new" to create a new zone (type in some friendly name of the zone in that case - that will not be visible anywhere except your AWS control panel)
- In a distribution setup form you will be notified of the settings required. You have only 1 editable field, which is the alternative hostname of your WordPress host. For example, if you have a "myblog.com" website with A record pointing to 1.2.3.4 IP, create another origin.myblog.com DNS record with A record pointing to 1.2.3.4 IP and type in "origin.myblog.com" in this form.
- You get a success page with information about DNS changes. Now you need to change the record of your WordPress host from the IP address and replace it with the CNAME of the specified hostname.
- It works.
First, enable Browser Cache and disable the "Expires" header. This is because CloudFront does not cache properly when "Expires" headers are set. When using CloudFront and full page caching there is no purging of cached pages when posting new posts etc. Cache invalidation in CloudFront is limited per month and also takes up to 15 minutes to complete.
Since there is no purging and you want people to be able to comment it is recommended to use a hosted commenting software, such as Facebook Comments or Disqus. If you do not use this comments are not shown after they have been posted or approved.
The main step to get CloudFront full-page caching working is to have your site on a different domain than the one you want your visitors to see. So you should install or configure your site so it's on a separate domain, for example, wp.example.com. You will then later configure example.com so it's used by CloudFront.
How to configure CloudFront on AWS:
- Go to AWS Console
- Click "Create Distribution"
- Select "Web"
- Click "Continue"
- Enter wp.example.com into "Origin Domain Name"
- Enter CustomWWW-example.com into "Origin ID"
- Set Origin Protocol Policy to HTTP Only (CloudFront will connect to my origin using only HTTP).
- Select "Allow HTTP Methods" - GET, HEAD, PUT, PATCH, DELETE, OPTIONS
- Select "Forward Query Strings" - Yes
- Enter example.com (the domain that your visitors will type into their browser) into Alternate Domain Names(CNAMESs)
- Set logging to "On"
- Enter "webserverlog-example.com" into "Bucket for logs"
- Enter "stats-logs/" into Log Prefix
- Enter "CDN for example.com" into Comment.
- Click "Create Distribution"
Configure DNS
- Add a new CNAME record for example.com that points to the Domain Name that belongs to the distribution you created previously.
How to configure W3 Total Cache: There are two methods to configure W3 Total Cache CDN. Origin Pull "CloudFront" or "Generic mirror". If you want to be able to invalidate URLs from within WordPress you need to use the CloudFront option. If you do not configure a CDN the wrong URLs will be used when linking to CSS, JS, and other files.
Configure CloudFront:
- Select Origin Pull (Mirror) Amazon CloudFront on the General Page
- Go to the CDN page.
- Enter your AWS credentials
- Enter example.com as a CNAME
- Save Settings
Configure Generic Mirror:
- Enter example.com into "Replace site's hostname with:"
- Save Settings