Setup a Free Photon CDN without installing Jetpack Plugin for Images

Learn how to setup a free and forever WordPress Photon CDN without using the heavy JetPack plugin for serving your static images from i0.wp.com, i1.wp.com, i2.wp.com, i3.wp.com servers.

The Content Delivery Network aka CDN is the cluster network connected to each other to serve the static files from the closest data center to the end-user. The WordPress has it’s own CDN network known as Photon CDN that sync and serve the images from the WordPress blog.

However, officially WordPress Photon CDN needs a Jetpack Plugin to support free CDN. But, most WordPress bloggers and developers do not prefer installing Jetpack as it’s too heavy. Hence, a lot of WordPress users miss the chance to use this free CDN service.

In this article, we are going to learn how to set up the CDN Enabler plugin to use the WordPress Photon CDN address for serving the images via free CDN without installing the Jetpack module.

If you’re following us, this is the seventh article and video demo in the #WordPresssBlog series. We previously posted about the WP-Optimize setup for Database and Image Optimization.

Let’s dive into setting up the free WordPress Photon CDN for media images without Jetpack plugin —

What is WordPress Photon CDN?

WordPress Photon CDN is the free image content delivery network that serves the locally uploaded images from the nearest data center server that is spread across the globe.

Say suppose my server is hosted at New York data center and a blog reader accessing the files from Sydney. This is quite a long distance for static files to travel, hence the website load time will increase significantly.

But, when we are using CDN service like WordPress Photon CDN for images. The static image files are synced across all WordPress data center. Now when the same reader access the files from Sydney, WordPress will try to access the static image from the nearest data center instead of our server location i.e. New York.

Hence, improving the site load speed and thus the user experience.

Install CDN Enabler WordPress Plugin

We are going to use this plugin called CDN Enabler by KeyCDN. This plugin helps to alter our website address and replace it with the WordPress photon’s address.

Follow the steps to install CDN Enabler on WordPress:

  1. Login to your WordPress Dashboard
  2. Navigate to Add New option under the Plugins menu
  3. Search and Install for CDN Enabler by KeyCDN
  4. Activate the plugin and head over to CDN Enabler settings page

CDN Enabler WordPress Plugin Activate

Setup CDN Enabler plugin for Photon CDN

The Photon CDN has 4 different CDN address that helps to serve the images from WordPress CDN. The Photon CDN addresses are:

  1. i0.wp.com
  2. i1.wp.com
  3. i2.wp.com
  4. i3.wp.com

These addresses are dynamically changed when we use the Jetpack enabled Photon CDN. However, in our case, we will be using either one of the addresses since CDN Enabler has only one field.

Let’s use the first address i.e. i0.wp.com for our demo site. Setup the CDN Enabler with the below details and make sure that you’ve correctly entered your image library location.
Photon CDN Setting in CDN Enabler Plugin

  • CDN URL: Enter the CDN address along with your domain name to serve the images. The CDN URL for my demo.restorebin.com will be: https://i0.wp.com/demo.restorebin.com
  • Included Directories: These are the default image library directory in our WordPress installation. You can just leave it to default whatever this displayed in the field. You may also add multiple local directories by separating with ,
  • Exclusions: List of file types that need to excluded from the CDN Enabler to apply the CDN URL. Make sure that you’ve excluded all the file types except image filetype. I personally exclude the following types: .php, .js, .json, .mp4, .pdf, .apk, .css
  • Relative Path: Keep this option enabled
  • CDN HTTPS: Enable this option to serve the images from HTTPS instead of HTTP. Since we have already set up the Let’s Encrypt SSL certificate, it’s important from a security standpoint that we are serving the images from HTTPS
  • KeyCDN API Key and KeyCDN Zone ID shout be blank

Upload and Test Free Image CDN

Now let’s upload an image into our media library to see if the images are served from Photon CDN address. Since we have set up to use the i0.wp.com CDN address for all the images, our uploaded image should be served from the same address.

https://i0.wp.com/demo.restorebin.com

Photon CDN URL of WordPress Image Uploaded

Video on Photon CDN without Jetpack

Watch the video tutorial on setting up the WordPress Photon CDN for serving the images from wp.com without using the Jetpack plugin.

Free Photon Image CDN without installing Jetpack Plugin in WordPress

I hope you liked the video, please subscribe to our channel.

What’s Next in #WordPressBlog Series?

Now that we have set up the free CDN for WordPress images using CDN Enabler, next we are going to touch base upon setting up the free CDN for our CSS styles and JS scripts files.

If you've any thoughts on Setup a Free Photon CDN without installing Jetpack Plugin for Images, then feel free to drop in below comment box. Also, please subscribe to our BrowserHow YouTube channel for amazing videos tips. Cheers!

Share
BrowserHow logo
Kushal Azza
I've keen interest in exploring the latest tech and gadgets. A digital development and analytics consultant. Also, a geek behind this website/blog!

8 Responses

  1. Mas fery says:

    This guide is very interesting. But, does this CDN plugin not make my site slow? then is there another guide without using the help of a plugin?

    • Kushal Azza says:

      Thank you, Mas.

      Of course, we can use the rewrite rules in our webserver (Nginx, Apache, etc.) and modify the URL to load from wp.com CDN. But, it may sometimes break the uploading. In that case, we need to carefully write the rules that support uploading into our host but retrieving with prepended wp.com CDN URLs.

      One thing that I like about the plugin, it just rewrites the URL on fly. If tomorrow you deactivate the plugin, within no time your images will be served from your host instead of CDN.

      However, feel free to experiment and let me know how it goes without a plugin. 🙂

  2. Jesus says:

    Is safe use this method? can i get banned? and if i get banned this only excludes me from jetpack services or there is any other service affected

    • Kushal Azza says:

      I don’t think there is a way to track down the user of this service. Anyways, this is a free service offered by WP.com, hence I don’t think there will any issue.

      In the worst case, a website can be blacklisted. But, chances are negligible.

  3. adie says:

    Hi,

    Thank you for the great information above.
    I have a quick question, I’m using short pixel AI and the images are served from their CDN ….but I want to use the CDN you have shown above I have set it up as the steps you have shown.

    But now I would like to change the settings in Shortpixel AI to the new CDN …..do I just copy and paste the new URL path as above or do I still need to do a cname record?

    here is a screenshot od short pixel AI advance settings to change to new CDN

    [link removed]

    p.s appreciate any help or info you can give, please

    Kind regards
    Adie

    • Kushal Azza says:

      Hi Adie, I haven’t used Shortpixel, not sure if this works! However, you can try using the i0.wp.com/yourwebsite.com/img/folder/ as CDN to check whether it works or not.

      And make sure to select the option to BOTH instead of SRC or SRCSET. This will help in rewriting all the image URLs on site.

      As far as CNAME, I don’t think you need any CNAME record. Simply changing the CDN URL will do.

      Let me know how it goes.

      //KushalAzza

  4. kross says:

    Hello – this is amazing… just one issue – many of the store icons are replaced with a small square… such as the scroll to top, the empty cart icon, the plus and minus buttons in the cart…

    • Kushal Azza says:

      It’s possible that you’re using the FA-Icons on your website. It’s not the issue related to this setup. Check for any browser console errors while loading your site.

Leave a Reply

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