Setting Up CDN with WordPress Installed with W3 Total Cache Plug-in

This article provides instructions on configuring your Content Delivery Network plan with WordPress, installed with the W3 Total Cache plug-in.

• Content Delivery Network plan purchased with Nexcess. If you do not yet have a CDN plan, visit the Content Delivery Network page.

• The latest version of WordPress, installed with the W3 Total Cache plug-in.

• If you have questions or are in need of assistance, please feel free to send us an e-mail at support@nexcess.net.

1. Log in to your client portal.
2. On the left menu, click on the All Services option, which will show all of your Nexcess services.
   
3. Next to your Content Delivery Network service, click the Options button, which will present a list of options.
   
4. You will need to access the CDN control panel, so select the CDN Control Panel option.
   From within the control panel, you can configure the large and small HTTP delivery mechanisms. However, since WordPress mainly stores small static files such as images and stylesheets, you will want to configure HTTP Small.
5. Proceed with the instructions provided under HTTP Small Configuration (below).

1. Click on the HTTP Small tab at the top, and then click on the Customer Origin option (located below the tabs).
   
2. Enter your domain information in the fields.
   

• A - Directory Name: This is a new directory that you are creating on the CDN. It's the directory you will eventually use in your URLs when you are serving content from the CDN. It can be anything you want (no spaces or special characters). Please note that this directory does not correlate to a directory on your hosting service; it is just used for organizational purposes. If you use the “images” directory, you will still need to append another “/images” directory to the URL generated.
• B - HTTP Edge Protocol: Leave this selected. This puts your content on the CDN.
• C - Hostname or IP Address: Here, enter the name or IP address of your host server; e.g., "http://example.com". (Note that the port will be automatically appended to the URL that you enter.) This is the server from which the CDN will pull static content. Click Add to add the server to your list. You can specify additional locations if you have mirrored your content and would like failover.
• D - Load Balancing Mode: Leave all other fields with default settings, unless you have an advanced understanding of your configuration.
• E - HTTPS Edge Protocol: Leave un-selected.
• F - HTTP Host Header: Leave this field blank.

⇒ When finished specifying the settings, click the Add button (located at the lower, right-hand corner of the page).

NOTE: If you do not wish to set up the CNAMEs, use the full URL that was provided after you set up your origin server (in HTTP Small procedure). Follow the steps below to set up the CNAMEs for your CDN (Optional).

1. After you have set up your origin server (HTTP Small Object), the URLs for your CDN origin are presented on the HTTP Small Object page.
   
2. Under URLs for your CDN Origin, copy the portion of the URL that represents your CDN domain name (see the following example screen).
   
3. Click on the Edge Cnames option (just below the tabs).
   
4. In the New Edge Cname box, type the name of the desired CNAME record (the subdomain that you want to use to access your CDN service).
   
5. Select the Customer Origin radio button.
6. In the Points To: box, select the location on the origin server where the CNAME will point to. In the following example screen, the directory name (created in Step 2 of the HTTP Small Configuration section) is appended to the path.
   
   At this point, you need to add the CNAME to your zone file through your SiteWorx account.
7. Log in to your SiteWorx account. On the main menu, select Hosting Features > Domains > DNS Records.
8. Click the View Records link for the subdomain (under the Action column).
9. From the Add a new: drop-down list, select CNAME, and then click Go.
   
10. In the Host box, enter the hostname for the CNAME that you defined in Step 4; e.g., "cdn.nexcess.net"
11. Leave the TTL default value.
12. In the Alias box, paste the URL that you copied in Step 2 of this procedure; e.g., "wac.12345.nexcesscdn.net".

⇒ When finished, click Save and then proceed with the WordPress setup instructions (below).

Please be sure that you have WordPress already installed, along with the W3 Total Cache plug-in.

1. Go to the settings page for the W3 Total Cache plugin.
2. Scroll down to the CDN section, and then select the check box to enable the CDN.
   
3. For the CDN Type, select (Origin Pull) Generic Mirror.
4. Click Save All Settings.
5. On the WordPress side menu, under the Performance section, select CDN.
   
6. Scroll down to the Configuration section.
   
7. From the SSL support drop-down list, select Disabled (always use HTTP), and then enter your CDN CNAME in the Replace site's hostname with: box.
   
8. Click Save all settings, and then deploy your W3 Total Cache configuration.
   NOTE: The CDN takes approximately one hour to cache the content. Also, any time cache is flushed, it can take one hour to re-cache.
9. After about an hour, load your Web site to be sure that there are no missing elements on your page. If there are missing elements, check to make sure all your settings are correct.

Once everything is working correctly, you can check the source code for the HTML page to ensure that your images, javascript, and stylesheets are being loaded from the CDN. You may also want to consider using a tool that tests the load time of a page, such as Pingdom Tools.

If you want to purge the CDN at any time you can do so via the CDN control panel by again clicking on large or small HTTP and then clicking on the My Edge sub-menu. Alternately, you can purge all URLs at once by simply using our client portal and selecting the Purge CDN Cache option next to the CDN service.

To get the most out of the CDN, you'll want to turn on compression which makes each request smaller. You will need to do the following for both the HTTP Large and HTTP Small to fully utilize the CDN's compression ability:

1. Click on HTTP Large.
2. Click on Cache Settings.
3. On the left menu, click Compression
   
4. You will see the compression enable/disable radio buttons. Turn compression on here.
   
5. You also need to add the following text to the end of the File types box:

   ,application/javascript

   
   

6. Save the settings and within an hour you'll see smaller files! Make sure you do the same for HTTP Small as well.

If any elements on your site appear to be missing, it could be due to:

• The CDN has not fully cached all of your Web site's content. It takes approximately one hour for the CDN to cache content. Also, any time cache is flushed, it will take approximately one hour to re-cache.

• The CDN configuration settings are not properly defined. Follow the steps provided in this article to verify that you have entered the correct settings.

If you are still having issues with your CDN, send an e-mail to support@nexcess.net.