This documentation and answers will help you get started and master the way you use PageCDN for better content delivery.
PageCDN makes CDN setup easy for web developers, and a lot easier for WordPress users.
Setting up CDN on a Website
Using PageCDN with your website requires that you:
- create an account and complete billing steps;
- create a repo to pull content from your website;
- modify URLs of static resources on your site to use the CDN links.
A repo is code repository that holds all your website files cached on PageCDN. Its easy to create and configure repos manually. And, if you have a WordPress website, things are much easier as our plugin can automate most of the tasks.
Assuming that you already have created an account and submitted billing info, you can start following the next steps.
When using WordPress, creating a repo on PageCDN is optional because plugin will handle it for you. To create a repo for other purposes (like manual integration):
- Click the 'My CDN' link on top bar.
- Next, click on 'Add New Website' in the left navigation bar.
- On next page, click on 'Website' tab. If this is your first repo, clicking in 'My CDN' in the first step should automatically take you to the 'Website' tab, so the step 2 and 3 may not be required.
- Type your website URL (Origin URL) starting with http or https. In most cases this is the URL of your website
https://example.com/. You can also use URL of a directory on your website, e.g.
https://example.com/static/files/. This helps you shorten the path if you want to fetch files from a single directory that is very deep in hirerarchy. You can also create separate repos for separate directories with different configuration to get the most optimal setup.
- The default configuration for the repo is good for most use cases. However, you can may want to configure it as per your needs.
- Click 'Connect to Website' button.
Completing the form will create the repo and take you to the 'Setup Guide' page of the repo that contains further specific details. To see the list of all the repos in your account:
- Click the 'My CDN' link on top bar. If you already have some repos, it will take you directly to the list of repos. If it doesn't, then:
- Click on 'My Websites & Files' to see all available repos.
To connect to a Github repo or to create storage for manual uploads, all you need is to go to the 'Github Repo' or 'File Storage' tab and repeat the same steps with minor changes. If working with Github repos, please skip to the 'Setting up CDN on a Github repo' section below.
With our WordPress plugin, setting up CDN on your WordPress website is very simple and mostly effortless. You do not even need to configure anything on PageCDN to connect to your website. The plugin does everything for you.
To use WordPress plugin, please create an account and complete billing setup. PageCDN WordPress plugin requires API access to create repo, to create most optimal content delivery strategy and to purge CDN cache. PageCDN WordPress plugin helps with automatic Public CDN integration too. The entire process takes just few seconds once you you have a fully activated account.
To integrate PageCDN with your WordPress website, please follow these simple steps:
- On PageCDN, go to Settings → User Profile and copy the API key.
- On your website, install PageCDN WordPress Plugin and activate it.
- In WordPress admin panel, goto the Settings → PageCDN.
- On settings page, paste the API key in the relevant field in Premium CDN section.
- Save changes.
- Go to your website homepage and test the changes.
If at some point you may need to flush the CDN cache, there is a purge button avilable on the admin bar. Clicking that button will flush the cache and will force PageCDN to fetch fresh files from your website.
After this, your WordPress CDN setup is complete and in most cases you may not need to change the configuration any further. The default settings provide the configuration that usually work with any any website. But if you want to understand or optimize things further, you may need to continue reading how things work behind the scenes.
Optimizing caching and performance
The default settings are usually good for most websites, but you may need to optimize HTTP Caching, Edge Caching, Compression, Server Push and other settings for your website. All these are configurable from inside the plugin. For further details, you can read the configuration section of these docs to know how individual settings work.
Working with Easy Fonts
Google Fonts is an excellent fonts collection that is available for free for any website. These fonts and CSS files are served through a CDN for super fast delivery. However, there are some limitations that we try to cover through Easy Fonts library. If you want to try Easy Fonts, you will need to enable 'Use better cacheable fonts from PageCDN' option on plugin settings page.
Enabling the option will try to replace all references to Google Fonts CSS with PageCDN hosted Easy Fonts.
Minimizing DNS lookups
Using Public CDN for cache re-use
A WordPress website consists of the WordPress core, some plugins and a theme. All of these usually contain opensource resources like jQuery, Bootstrap, Angular, Font Awesome, etc. Serving these resources, along with other website files, over a CDN can make your website to load quicker. However, its better and more optimal to use Public CDN for such opensource resources for the below reasons:
- Public CDN is free. You can save some bandwidth costs by serving these resources from Public CDN.
- Resources over Public CDN are more likely to be in browser cache for even first time visitors because visitors' browser may already have a copy of such public files from another website. This can significantly speedup page load time.
- Opensoure files are properly versioned, and never change. PageCDN uses this information to optimize the content for better performance.
PageCDN WordPress plugin supports working with opensource resources and if you enable 'Optimize Opensource content' option in plugin settings, it will try hard to offload as many resources to Public CDN as possible.
Using minified public files when available
Our Public CDN hosts developement and production (minified) versions of files of many opensource libraries, themes, etc. If a plugin or theme that you use uses an un-minified version of an opensource library, PageCDN plugin may be able to find a matching minified file for you if you enable the option 'Use minified public files where possible'.
Setting up CDN on a Github repo
You can setup PageCDN to pull contents from a Github repo. By default, PageCDN works with releases and fetches files from github for:
- Only fresh releases if you properly setup a github hook.
- Old releases if you sync releases manually or through API.
PageCDN fetches just production releases from your Github repo, and skips all releases that have
similar keywords that indicate a non-production release. Releases containing invalid characters are also skipped.
You can also create a repo with 'Website' Origin and use
https://raw.githubusercontent.com/ as 'Website URL' to pull files from a specific commit of a Github repo, and then configure your repo on PageCDN to
apply your own caching and compression configuration.
Setting up CDN with public Github Repos
The initial repo setup process for public Github Repos is the same as described in 'Creating Repos' section above. Once a repo is created on PageCDN for pulling contents from a Github repo, you can open the repo and click on the 'Maintenance' link and choose 'Sync' to start pulling files from Github.
However, you may want to automatically pull new releases as they are created on github. This requires some additional steps:
- On My CDN → My Websites & Files choose the relevant repo.
- Click Setup / Integration Guide on the left navigation.
- Copy the 'Webhook URL'.
- Go to your desired repo on Github.
- Click Settings.
- In the navigation on left side, click Webhooks.
- On next page, click Add Webhook.
- Paste the Webhook URL in Payload URL field.
- Click on Let me select individual events option. It will open a list of events that Github can send through API.
- PageCDN accepts only releases, so uncheck all the events and check only Releases.
- Click on Add Webhook to complete the setup.
Once done, Github will notify PageCDN of all the releases created on this Github repo and PageCDN will be able to fetch files as and when they are available.
Setting up CDN with Private Github Repos
The process of setting up CDN on a private Github Repos is the same as for the public Github Repos above, with the following extra steps:
- Open your Github Developer Settings, and go to 'Personal Access Tokens' page.
- Click on Generate New Token.
- In the 'Note' field, type some text like 'PageCDN Access Token' for your reference in the future.
- In the Select Scope area, Check 'Repos' and its child options.
- Click Generate Token.
- It will generate a token on the next page and display it only once. Copy that token.
- Goto Account Integration Settings on PageCDN.
- In the Github Personal Access Token field, paste the token and save.
Test the setup by creating a test release on Github. With 'Personal Access Token' PageCDN has access to all the Github repos that you have access to. You can setup CDN on more private repos without going through these steps. For every such setup, any releases created on Github will be available on PageCDN within seconds.