February 06, 2019
How to fix Jetpack Site Accelerator not serving background images over CDN

What is Jetpack Site Accelerator and why should I use it?

With over 5 million installations, Site Accelerator, formerly Photon, is easily one of the most used and useful plugins available for WordPress. If you’re serious about user experience or SEO, this plugin is a must have in order to compress and speed up displaying of your website’s images. Site Accelerator comes bundled with the Jetpack WordPress plugin and uses the WordPress.com CDN to serve your website images.

How to tell if your background images are being served over CDN

If you’re using Site Accelerator to optimize and serve your images on WordPress, you might notice that your background images aren’t being served via the CDN. You can tell when viewing the source of your webpage and looking for the placement of the image. If the url does not contain i0.wp.comi1.wp.com, or i2.wp.com, the image is not being served via the CDN. Majority of the time, this is related to the WordPress theme not properly embedding the correct image.

How to fix background images not being served via CDN

While all themes are different, using a good IDE or text editor can help find where the image is being injected into the website template. Use the id or class attribute values as a good starting point for your search. You can use PHP’s function_exists function to determine if the plugin is installed.

if (function_exists('jetpack_photon_url')) {
    $image = jetpack_photon_url($image);
}

You’ll need to replace $image with whatever variable or function is being used to store the image url. The jetpack_photon_url function will return the url of the image from the CDN instead of the local media library.

Conclusion

Once the images are properly being optimized and fetched from the CDN, you should notice a significant increase in your site speed. Using Google’s PageSpeed Insights tool is a great way to see your page’s performance before and after enabling this plugin. Being that my website was using larger background images for the header section, my speed increased substantially. I definitely recommend contacting your WordPress theme’s develop if you’re having trouble locating where your theme is injecting the background image.

Copyright © 2022 Allan Kiezel – Long Island Web Designer & App Developer. All rights reserved.