I have to fix some issues at a wordpress site which another developer has set up with a custom theme. The theme includes a style.css file which is referencing a font file in the same theme:
@font-face {
font-family: 'foo';
src: url('fonts/foo and bar.eot');
url('fonts/foo and bar.woff') format('woff'),
url('fonts/foo and bar.ttf') format('truetype'),
url('fonts/foo and bar.svg#svgFontName') format('svg');
}
Without minification the style.css files gets loaded and fonts pointing to <base-url>/wp-content/themes/<theme-name>/fonts. When the CSS minfy feature is enabled the site fails to load the font files as the relative links are still the same and are now pointing to <base-url>/wp-content/cache/minify/fonts . The fonts folder does not exist in that location.
I've tried uploading the themes fonts/ folder to wp-content/cache/minify which did not work long as either the font files got renamed to .old files or the whole folder got removed serverside. Don't know if this is the doing of W3 Total Cache or another process.
CDN support is not enabled. Configuration of the CSS minfy feature looks like this:
As I am pretty new to Wordpress I would appreciate any hint to a solution or approach I can look into.
I know I could try to embed the font files directly into the css file, but that approach is not wanted due to file size. So I am basically looking for the default way how to handle this with the W3 Total Cache extension.
Note: Replacing the relative urls with absolute urls is not an option as the site is used in different environments with sub directories and on main domain level.
UPDATE I have figured out that the issue seems to be a bug inside the plugin which is related to using files names including whitespaces. Have updated the reference code above. Version of W3 Total Cache is 0.9.6
