How to use Cloudflare with ShortPixel Adaptive Images

Note: If you're having SiteGround as your hosting provider you cannot properly set Cloudflare and use it as a CDN together with ShortPixel Adaptive Images. For more information, visit this page: CDN via Cloudflare for websites hosted at SiteGround, it this possible?

If you want to use Cloudflare as your CDN when using ShortPixel Adaptive Images, instead of ShortPixel's CDN, follow these steps:

Enter your Cloudflare account
Select the DNS section from the top menu.
Add a new CNAME record from cdn.your-domain.com to no-cdn.shortpixel.ai:

Remember that your-domain.com should be changed to your actual domain, and that cdn should be changed to something else if it's already being used. For example:
- images.myblog.com
- media.thebestshop.com

The little cloud must be orange so you can use the CDN features offered by Cloudflare.
Wait 5 minutes for Cloudflare to finish up all the technical tasks in the background.
Take any image URL from your site, append it to https://cdn.your-domain.com/spai/q_lossy+ret_wait/ and make sure that the new URL can be accessed. Example:
1. If your website is mybeautifulshop.com, your new CNAME on Cloudflare is img.mybeautifulshop.com, and your example image is https://www.mybeautifulshop.com/wp-content/uploads/2022/04/image.jpg...
2. ...try to access this URL: https://img.mybeautifulshop.com/spai/q_lossy+ret_wait/https://mybeautifulshop.com/wp-content/uploads/2022/04/image.jpg
3. Can you view it with no errors? Continue to the next step.
Go to Settings > ShortPixel AI > Behaviour and enter https://cdn.your-domain.com/spai in the API URL field
1. Replace your-domain.com with your actual domain name.
2. Replace the cdn part if your subdomain is different, like configured above.
Clear the CSS cache from ShortPixel AI's settings: