How to Set Up Vultr CDN for WordPress Websites with W3 Total Cache

Updated on January 29, 2024

Introduction

W3 Total Cache is a WordPress caching plugin that offers multiple configuration options and full-site CDN functionality. Similar to other caching plugins, W3 Total Cache minifies WordPress files to improve the website load time and speed. Follow the steps below to install the plugin on your WordPress website.

This article explains how to set up Vultr CDN for WordPress websites with the W3 Total Cache plugin.

Prerequisites

Before you begin:

  • Create a Vultr CDN for your WordPress website by providing the domain name as the origin URL.

  • Log in to the WordPress administration dashboard.

    https://example.com/wp-admin

Install W3 Total Cache

W3 Total Cache is a WordPress caching plugin that offers multiple configuration options and full-site CDN functionality. Similar to other caching plugins, W3 Total Cache minifies WordPress files to improve the website load time and speed. Follow the steps below to install the plugin on your WordPress website.

  1. Navigate to the Plugins page on the main navigation menu.

  2. Click Add New Plugin to browse the WordPress plugins database.

    Install a new WordPress Plugin

  3. Enter the w3 total cache keyword in the search plugins field.

  4. Verify the search results and click Install on the W3 Total Cache plugin result to start the installation process.

  5. When successful, click Activate to enable the plugin.

    Activate W3 Total Cache

Configure W3 Total Cache

  1. Find and click Performance on the main navigation menu to access the W3 Total Cache configuration page.

  2. Click General Settings from the drop-down list of options.

    Access W3 Total Cache General Settings

  3. Scroll and find the CDN section.

  4. Check the CDN: Enable option to activate CDN configurations.

  5. Click the CDN Type drop-down and select Generic Mirror from the list of CDN options.

    Select W3 Total Cache Generic Mirror

  6. Click Save Settings to apply the changes.

  7. Find and click CDN on the plugin navigation list, or click Advanced Settings to navigate to the CDN configuration page.

  8. Verify that the following prompt is displayed at the top of your CDN configuration:

    Content Delivery Network object support via mirror is currently enabled and not authorized.
    
    Content Delivery Network full-site-delivery support via None is currently disabled and not authorized.
  9. Scroll to the Configuration: Objects section and keep Auto (determine connection type automatically) as the selected SSL support option.

  10. Enter your Vultr CDN URL in the Replace site’s hostname with: field.

    Enter the Vultr CDN Endpoint in W3 Total Cache

  11. Click Test Mirror to verify and test your CDN connection.

  12. Verify that a Test Passed prompt displays as your Test Mirror result.

  13. Click Save Settings to apply your CDN configuration.

  14. Verify that the following options are enabled in your General section:

    W3 Total Cache General CDN options

    • Host attachments: Caches all WordPress website attachments to the Vultr CDN
    • Host wp-includes/files: Caches all enabled wp-includes file types to the Vultr CDN.
    • Host theme files: Serves all enabled theme file types from the Vultr CDN.
    • Host minified CSS and JS files: Caches all minified files to the Vultr CDN.
    • Host custom files: Caches all custom file names and paths specified in your advanced configuration to the Vultr CDN.
  15. Scroll to the Advanced section, and activate the following options:

    W3 Total Cache Advanced CDN Options

    • Use CDN links for the Media Library on admin pages: Migrates all uploaded WordPress image links to the matching Vultr CDN URL links.
    • Disable CDN for the following roles: Disables cached WordPress data for administrative user roles
    • Add CORS header: Allows other domains to link and use your Vultr CDN resources. To avoid content conflicts, verify that CORS is enabled on your Vultr CDN endpoint.
  16. Verify the wp-includes and theme file types to cache with your CDN.

  17. Click Save Settings to apply your CDN configuration changes.

Test the Vultr CDN Integration

  1. Access your WordPress website in a different web browser such as Chrome to visit your site as a regular user.

    https://example.com
  2. Right-click anywhere within your website section and select Inspect from the list of options.

    Inspect WordPress website sources

  3. Navigate to the Sources tab and verify that your Vultr CDN URL is available on the list of website sources.

  4. To verify the CDN image integration, right-click any of your WordPress website images and select Copy Image Address or Copy Image Link depending on your web browser type.

  5. Paste the image link in your URL bar, and verify that it uses a Vultr CDN URL instead of your WordPress website URL.

    Copy a Vultr CDN Image URL

  6. Press Enter to visit the URL address and verify that your WordPress website image displays correctly as your web browser result.

Conclusion

You have configured your WordPress website to use your Vultr CDN endpoint. Depending on your caching plugin, you can offload most WordPress file types to your CDN and improve your general website performance.