Loading the WordPress post images in WebP format is of great importance today since WebP format reduces the size and Google wants that we use WebP format. Even if the gain in terms of size reduction is not significant, it is probably a good idea to solve the “issues” pointed out as errors in PageSpeed Insights.
Various whimsical rules and instructions imposed by Google do not stay with time. This is an example of what the users think about AMP and WebP. Always give them a link to download JPG or PNG images below the important illustrations.
When we have an affordable tool/service which does not disturb our setup but dynamically delivers WebP images then it is worth trying. CacheFly is an excellent CDN for general purpose usage. Bunny CDN is not too much slower than Cachefly and it offers an affordable tool for offsite image optimization.
---
The good things about BunnyCDN are that:
- 14 days free trial with no credit card info required
- Using their WordPress plugin is not mandatory
- It is origin pull CDN i.e. exactly like Cachefly static things from your server will automatically get pulled to their system.
- Just few minutes setup
- Compatible with WP Super Cache plugin (the only completely free cache plugin which can compete with the paid cache plugins)
- Does not cost huge, the extra services offered by Cachefly are not affordable
If you do not have a BunnyCDN account, you can signup from here. The link is an affiliate link, which helps us to earn money to gather funds and test various things for the readers like you. There is no charge for testing BunnyCDN for 14 days. 1TB is too huge to spend in 14 days.
Step 1: Setup Your Site on Bunny CDN
Add a name for your site to complete the hostname, for example, have used tcwc so that the CDN URL of BunnyCDN becomes tcwc.b-cdn.net. Add an origin, for example, https://thecustomizewindows.com in our case. Enable always using HTTPS.
Go to Cache settings, and enable Smart Cache and Query String Sort options.
Go to Origin Shield settings, and enable the Enable Origin Shield option.
Go to Optimizer, enable Bunny Optimizer, WebP Image Compression, Dynamic Image API, Minify CSS Files, Minify JS Files, and Smart Image Optimization.
Go to this URL https://dash.bunny.net/account/settings and scroll for the API key. Keep the webpage open for the next step.
By now, you can load your CDN URL on a browser, like ours – https://tcwc.b-cdn.net/.
Step 2: Setup Your WordPress Site for Bunny CDN
If you use WP Super Cache, then change the CDN URL to Bunny CDN’s one, it is https://tcwc.b-cdn.net for us.
It is better to install Bunny CDN’s official WordPress plugin. Go to the plugin installation page, search for Bunny CDN, install the plugin, go to its settings page, fill in the field to help the plugin to create the CDN URL and copy-paste the API key.
Setup done. Wait for 15 minutes.
Step 3: Test Using Various Online Services
Open your website’s page with the image. Right-click on the image and try to save it. The format suggested to be saved will be WebP. Look for any 404 and the response headers of the image files. You’ll get the content-type: image/webp response header.
Open Internet Explorer on your Windows PC and check the images.
Go to https://www.browserling.com/ and test your site by loading on an older version of Windows and Internet Explorer 10. Probably your SSL settings will not allow too old OS and browsers to open the page.
Open Webpagetest.org. Test your website’s page with images.
Tagged With bunny net webp