How does the "Replace in CSS files" feature work?
ShortPixel Adaptive Images added in its version 1.4.0 a new feature called Replace in CSS files.
We added this feature so we can replace the background images on CSS files with an optimized version. If it's enabled, SPAI will do its job for such files, which is:
- Minify the CSS files
- Take the background images and optimize them
- Serve the background images from our CDN, which means that it will replace the URLs of the background images. For example, this - www.example.com/image.jpg - will be changed to - cdn.shortpixel.ai/spai/.../www.example.com/image.jpg -
This option works by default for CSS files on your domain. If you have CSS files from other domains, you can add them on the text box, separated by commas.
How does this option work with other optimization plugins?
You may be wondering what happens with other plugins like WP Rocket or Autoptimize, that also minify CSS files. Since this is a new setting, for now we recommend you to deactivate any other CSS minification option disabled; only SPAI's. SPAI will not change the structure of the CSS files, will not move CSS from the head to a file or back nor will not merge files.
We are working on a better integration with other plugins so you will not need to make sure that only SPAI's CSS minification is enabled.