How to create own self hosted CDN for WordPress

Filed Under: WordPress

I know how frustration it is when you try to open a web page and it takes 10-15 seconds to load, so when you own a website its very much understandable why you want it to run fast and get pages loaded within 3-4 seconds.

I use wordpress and a couple of cache plugins to keep my website load fast but when I used Pingdom Website Speed Test to check the load time, it took 4 seconds to load, that is somewhat Okay but when I looked at the performance grade of 73, I knew that I can improve it a lot.

One of the areas where I got 0 score is “Parallelize downloads across domains” because all the dynamic (PHP) as well as static content (CSS, JS, Images) were getting loaded from my main domain which was causing it to load a bit slow.

wordpress-without-cdn

So I thought of creating my own CDN cookie-less domain for all these static contents. Here I am providing steps to create own own self hosted CDN and setting it up in WordPress WP Cache plugin, that helped me in reducing load time to 2.30 seconds and performance grade of 83.

Create Subdomain for CDN

This is a simple step, just login to your hosting control panel, either cPanel or Plesk and create a subdomain with the name you want. The important thing to notice is that the directory location of the subdomain should be the same as your website. Check below image for better clarity.

subdomain-cpanel

Create CNAME for CDN domain

I use Hostgator VPS account and I have my own WebHost Manager, so creating a CNAME for me was very easy. Go to “Edit DNS Zone” and select your zone to edit. You might notice that there are few A names already created for the subdomain you just created. Just delete all of these and create only one CNAME similar to below image.

CDN-CNAME

Cookie-Less CDN Domain

Our self hosted CDN domain is ready to use but before we make CDN configuration changes to WP Super Cache, we need to make sure our CDN sub-domain remains cookie-less because cookies are useless for static data but it consumes network and browser processing every time a request is sent.

Usually WordPress and Google-Analytics sets a lot of cookies, so we need to do some config changes to make our main domain as the primary domain for cookies.

To set our main domain as primary domain for cookies for google analytics, add following code in the google analytics script.


_gaq.push(['_setDomainName', 'www.journaldev.com']);

For WordPress, open wp-config.php and add below configuration.


define ('COOKIE_DOMAIN','www.journaldev.com');

WP Super Cache CDN Settings

Before you proceed with this step, I would suggest you to load some static contents from your CDN subdomain and make sure it works fine.

This part is really easy, just go to CDN tab of WP Super Cache settings and enable CDN support by providing the CDN domain URL.

Thats it, we are using our own self hosted CDN cookie-less domain, after that I checked the performance of my website. Below image shows the loading time reduced from 4.08 seconds to 2.91 seconds that a lot of improvement.

wordpress-single-cdn

But I noticed that my performance grade is still 73, it happened because all the static contents were getting loaded from my CDN domain. The solution was easy, I created two more subdomains for my CDN support and then updated WP Super Cache CDN settings to use multiple CDN servers. My final setting looks like below image.

wp-super-cache-cdn

Now when I run the website speed test again, I got a time of 2.30 (-1.78 seconds) seconds and performance grade of 83 (+10).

wordpress-multiple-cdn

Comments

  1. Lyon says:

    Does this tutorial still work in 2019?

  2. Md. Rakib Khan says:

    I have enable cdn with my sub domain at cdn.forum.horje.com
    But my main domain is plugin.horje.com

    But cdn isn’t work. even I have copied wp-content,wp-includes to cdn.forum.horje.com

    Do not work it.

    See following screen shot.

    https://ibb.co/f6YYt9
    https://ibb.co/mcV2mU

    Can you tell me why it’s not working ?

    1. Pankaj says:

      1. Check if you are able to access the static file in CDN?
      2. Next check if you are accessing already cached page? Delete cache and check again.

  3. WebHostingHero.com says:

    How do you prevent your content from being served from cdn.yourwebsite.com?

  4. رژیم کتوژنیک says:

    I used ssl on my primary domain but don’t have any ssl on my subdomain
    can I use self cdn?

    1. WebHostingHero.com says:

      No, you’ll need a SSL certificate for multiple domains / subdomains or a wildcard certificate.

  5. prince kumar says:

    hello iam creating this . and got images in my cdn domain but it is not show like you automatically, in images ..it show in cdn domain and also in my main domain .. how can i solve this.

    http://www.videcity.com

  6. Shan Iqbal says:

    Brother i’ve followed your method but it didn’t let me add the cdn process. Because my all files gone, CSS, Java, and images too. I’m using Wp Rocket. But when i select only images and then working fine but not load the images from cdn. GreenHorizon.ae it’s my website please solve it.

  7. Raphael Nikolai, I agree but if you’ve got enough credits, then you can spin up multiple droplets at different locations and set up CDN. This was just a lame solution. 😂. This would be costlier than opting for a CDN. In wordpress, it’s better to just install Jetpack and use its Photon feature. It takes care of the rest. I’m using it. wroffle.com
    You can check my website’s speed on pingdom.

  8. Francesca says:

    Thanks for your share, this work fine for me.
    Thanks you.

  9. Doronize says:

    I tried it and it broke my site style

  10. Achidamex says:

    Pls, according to the super cache cdn settings, the additional cnames you include, are they to be created also when am setting up the dns or is it created by default?

  11. Guido Gallenkamp says:

    That solution does only work if you use http://www.domain.com as only the www subdomain will deliver cookies.

    If you use the SEO friendly domain.com for your content, all subdomains will deliver cookies.

  12. Raphael Nikolai says:

    CDN stands for Content Delivery Network. Your files are spread across multiple servers and is served to clients from the nearest server for optimal loading speed. In your case you are still hosting your files on the same server, hence users from the other side of the globe will still experience slower connections compared to user located near your server…

  13. Somesh says:

    How to use it for w3t

  14. I recently changed my set up to use 3 CDN sub-domains. I was looking around for confirmation that I did things correctly and it looks like I have. Although I don’t use WP SuperCache’s CDN functionality. Instead, I use a plugin to, as the page loads, swap out URLs of my choosing with a cdn sub-domain. After the replace, WP SuperCache creates a cached copy and I’m good to go.

  15. nici mclachlan says:

    This works fine, if you are not running a multisite.

    What about if you are running multiple domains, off the one WordPress install?

    What URL would you set for the cdn, and what settings would you use/

Leave a Reply

Your email address will not be published. Required fields are marked *

close
Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages