Support

Find answers, guides, and tutorials to supercharge your content delivery.

Custom CDN Integration

Updated on October 4, 2018

How to integrate the CDN into your website

This article focuses on how to integrate KeyCDN into your website and provide you with a better understanding of how to make use of the CDN. First, create a Push Zone or Pull Zone. After you created a Zone you need the Zone URL, which will be found in the KeyCDN Dashboard in the Zone tab.

  • Create a CDN Zone in the KeyCDN Dashboard
  • Get the Zone URL (created in step 1)

It is best practice that the HTML pages will be still loaded from your origin web server but all the static resources (like CSS, JavaScript, PNG, JPG, MP4, etc) will be delivered from the CDN. In most cases, the static content accounts for 80% or more of a website.

  1. Identify the resource in your HTML that you want to load from the CDN
  2. Replace the Origin URL with your CDN URL (Zone URL)

Important: Make sure that all URLs pointing to pages and other dynamic content remain untouched! The CDN should only deliver static content.

Simplified Example:

  • Origin URL: www.yourwebsite.com
  • Zone URL (CDN URL): lorem-1af.kxcdn.com

Your website:

<html>
    <head>
        <link href="http://www.yourwebsite.com/css/yourstyle.css" rel="stylesheet">
    </head>
    <body>
        <h1>Your Website Something</h1>
        <a href="http://www.yourwebsite.com/news.html" alt="just another link on your website">Your News</a>
        <p>My first paragraph.</p>
        <img src="http://www.yourwebsite.com/img/img.jpg" alt="just an example">
    </body>
</html>

After you integrated the CDN in your website:

<html>
    <head>
        <link href="http://lorem-1af.kxcdn.com/css/yourstyle.css" rel="stylesheet">
    </head>
    <body>
        <h1>Your Website Something</h1>
        <a href="http://www.yourwebsite.com/news.html" alt="just another link on your website">Your News</a>
        <p>My first paragraph.</p>
        <img src="http://lorem-1af.kxcdn.com/img/img.jpg" alt="just an example">
    </body>
</html>

Supercharge your content delivery 🚀

Try KeyCDN with a free 30 day trial, no credit card required.

Get started
KeyCDN uses cookies to make its website easier to use. Learn more about cookies.