How to Improve Your WordPress Website Loading Speed Using a CDN

Are you having trouble improving your website loading speed? The time it takes for your site to load plays an important role in the success of your business.

Slow websites are a big turn off for visitors, as it kills the entire user experience. As a result, you may be losing traffic to your website.

Search engines also pay special attention to your site speed. Google announced last year in its speed update that website load time is a part of its ranking factor. So, if you have a slow website, it might affect your rankings.

This is where a content delivery network or CDN can help you out. It boosts your WordPress site’s loading speed and delivers content instantly to users.

MonsterInsights is the best WordPress Analytics plugin. Get it for free!

In this article, we’ll show you how to improve your WordPress website loading speed using a CDN. Let’s dive right in…

What is a Content Delivery Network (CDN)?

A content delivery network (CDN) is a network of servers that are distributed around the world in different locations. They work by providing static content like images and stylesheets of your website to your visitors.

A CDN speeds up your site’s loading time by caching the static content on its server (also known as PoPs). And when a user requests to view your website, a CDN directs it to its nearest server and delivers the content.

As a result, your website loads within seconds and provides a great user experience to your visitors.

how does a CDN work

There are more benefits of using a CDN, and not just to boost your site’s speed. A CDN protects your website from crashing by distributing the load across its servers. It also sends a good signal to search engines, since your site will be lightning quick now.

That said, you may ask us which is the best CDN to use? There are many options, but we recommend MaxCDN. Let’s find out what makes it a top CDN and why you should use it.

Why Use MaxCDN to Speed Up Your Website?

MaxCDN is the best CDN for WordPress

MaxCDN, which is now part of StackPath, is one of the best WordPress CDNs you can get your hands on. It will quicken your website and deliver content to your visitors in under 20ms.

And now that it’s under StackPath products, you get 45 PoPs (point of presence) located around the world. That’s 36 more than what you’d get in MaxCDN as a standalone service.

Other amazing features of MaxCDN include:

  • Intelligent caching and purging
  • Customize your content delivery with its EdgeRules
  • High capacity SSDs
  • 1TB bandwidth per month
  • Free SSL certificates to protect against threats
  • Easy installation process
  • User-friendly interface
  • Detailed analytics of content delivery and traffic

Now, are you ready to learn how to configure MaxCDN on your WordPress site? Let’s begin…

How to Set Up MaxCDN on WordPress?

Follow these steps and you’ll be able to improve your WordPress website loading speeds within minutes.

Step 1: Create a MaxCDN Account

To start the installation process of MaxCDN, you’ll first need to create an account. Enter your email and select a password to get started.

create an account on maxcdn

Next, select a pricing plan and enter the payment details. MaxCDN offers a one-month free trial on its Edge Delivery 20 package.

Once your account is up and running, it’s time to create a pull zone.

Step 2: Set Up a Pull Zone

Now login to MaxCDN control panel, and from the options given on the top, click Zones.

click zones from top menu

Navigate to Pull Zones and then click Create Pull Zone.

create a pull zone

Now enter the details for your pull zone. You’ll have a few options you need to fill out:

  • Name: You could name your pull zone anything like myzone
  • Original Server URL: Enter your website’s address in Original Server URL field, such as https://www.example.com
  • Label: Add a label for more description if you want
  • Custom CDN Name: For a custom domain, you can enter any subdomain like cdn.example.com
  • Compression: To further boost your website’s performance, you can allow compression as it will save bandwidth (we recommend that you enable this option)

After entering the details, click Create.

enter details of pull zone

MaxCDN will take a few minutes to create a pull zone. You should see a progress bar showing that its provisioning your zone to the edge servers.

Once MaxCDN is done provisioning, you’ll receive a message that your Pull Zone has bene successfully create. To view your newly created pull zone, you can go to Manage Zones » Pull Zones.

pull zone successfully created

You will also get a URL for your CDN, which will look something like this: http://myzone.yourcompanyname.netdna-cdn.com/.

Copy this URL on a notepad, as you’ll need it later in the setup process.  Now, we’ll create a CNAME for your CDN domain.

Step 3: Creating CNAMEs for Your Domain

CNAME allows MaxCDN servers to load your website static content like images, JavaScript files, and stylesheets.

To create CNAME, go to Settings under the Push Zones tab. Here you can add multiple subdomains or CNAMEs of your website.

Enter at least 4 CNAMEs for your site like cdn.example.com, cdn1.example.com, cdn2.example.com, and cdn3.example.com.

You’ll have to add each CNAME one at a time by clicking the Add button. Do remember, you can add a maximum of 7 CNAMEs.

cname in maxcdn

CNAMEs will be needed when integrating MaxCDN on WordPress, which we’ll see in step 5.

Step 4: Set Up CNAME DNS Record Using cPanel

Many popular WordPress hosting services provide their users with a cPanel to manage different settings.

To set up a CNAME DNS record, you’ll need to login to your host’s cPanel and go to Simple DNS Zone Editor under Domains tab. The settings might change depending on your hosting company. For our tutorial, we’re using Bluehost.

Now enter the following details in the fields:

  • Domain: Select your website URL from the dropdown menu (it should automatically select your domain, but if not then click Reload)
  • Host Record: Enter the name of your CNAME record such as  cdn or cdn1
  • TTL: Don’t change or enter anything in this field and let it be
  • Points To: Paste the URL of your CDN in this field that you earlier copied on to a notepad (http://myzone.yourcompanyname.netdna-cdn.com/)

After entering the details, click Add Record.

bluehost cname record

You’ll have to enter the details for all 4 CNAME you created in the last step. The CNAME value (Points To), which is the copied CDN URL, will remain the same. All you have to do is change the Host Record to cdn, cdn1, cdn2, and so on.

Once this is done, let’s integrate MaxCDN on your WordPress site.

Step 5: Install W3 Total Cache WordPress Plugin

To add the CDN to your website, you’re going to need a WordPress plugin called W3 Total Cache.

Now go to your WordPress dashboard and then click on Plugins » Add New. Search for W3 Total Cache and install the plugin.

w3 total cache plugin

After activating the plugin, it should appear in your WordPress dashboard as Performance.

Step 6: Configure MaxCDN Using W3 Total Cache Plugin

Next, click on Performance » General Settings and scroll down to CDN. Now Enable CDN on your WordPress website and select MaxCDN as CDN Type. Do remember to hit Save all settings.

w3 total cache cdn settings

As you save the settings, you’ll receive a notification for an Authorization Key and Replace default hostname with. Click Specify it here in the notification, and you’ll be taken to W3 Total Cache CDN settings (you can also access the settings from Performance » CDN).

You can generate the authorization key from your MaxCDN panel. Enter the Authorization key and click Authorize.

auth key notification

In the Replace site’s hostname with field, enter the subdomains or CNAMEs you created earlier, like cdn.example.com, and click Add CNAME.

authenticate maxcnd and add cname

Once you’ve added all the CNAME, hit Save all settings.

You can also test MaxCDN to see if it’s running smoothly. One way of finding out if a CDN is configured correctly on your site is to check your image URLs. In the URL, your website address should be replaced with your CDN subdomains.

For example, this is your standard image URL:

https://www.example.com/wp-content/uploads/2019/08/yourimage.png

After adding a CDN, it should change to:

https://cdn.example.com/wp-content/uploads/2019/08/yourimage.png

Congratulations!

You’ve successfully set up MaxCDN on your website to improve its loading speeds.

The CDN will now store static content on its servers, and whenever anyone sends a request to view your site, it will use one of its PoPs to load your website instantly.

At this point you may ask us, how can we track our site’s performance after implementing a CDN? Let’s see…

How to Track Website Performance After Adding a CDN?

After you’ve set up a CDN, you can track your WordPress website’s performance using MonsterInsights by looking at the bounce rate.

If your site is loading fast, users won’t hit the back button because they don’t have to wait for your webpages to load. As a result, you should see an improvement in the bounce rate.

And thanks to MonsterInsights WordPress dashboard reports, you can easily view your site’s overall bounce rate.

To view the bounce rate, you can install the MonsterInsights plugin and then go to Insights » Reports » Overview. You can then view if the bounce rate increased or decreased compared to the past date range.

track site performance after setting up a cdn

And since CDN helps improve the search engine rankings, you should see a boost in your keyword positions. To track your keyword, use the MonsterInsights Search Console report.

Go to Insights » Reports and then from the top menu select Search Console. MonsterInsights will show your top keywords and their average position.

Search-Console-Report

You can select the date range from the top and then compare if the keywords improved after adding a CDN.

And that’s it!

We hope you liked our article on how to improve your WordPress website loading speed using a CDN. You can also check out our guide on why businesses need Google Analytics.

And don’t forget to follow us on Facebook and Twitter for more tutorials about WordPress and Google Analytics.

Want to Try MonsterInsights for Free?

Enter the URL of Your WordPress website to install MonsterInsights Lite.

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.