Jimothey
Jimothey

Reputation: 2434

Header set Access-Control-Allow-Origin "*" not working

I've been trying to get this working for the last 3 days.

I have a WordPress site hosted with 1and1. I'm using the w3 total cache along with my rackspace cloudfiles account. All theme files are hosted from the cdn (css, fonts etc). This works fine in all but IE and FF. Reading further into it on SO this is a widely known issue. So, following this answer I've added the following to my htaccess file under both the site root, the fonts directory and the css directory.

<FilesMatch "\.(ttf|otf|eot|woff)$"> <IfModule mod_headers.c> Header set Access-Control-Allow-Origin "*" </IfModule> </FilesMatch>

I've also hard coded my cdns path to my font like this:

@font-face {
font-family: 'LeagueGothicRegular';
src: url('http://112k3jh1g23kj1g23kjhg12k3hg1kj2g3h1g-r93.rackscdn.com/mysite/wp-content/themes/mytheme/css/fonts/League_Gothic.eot?') format('eot')...

The cdn is serving the correct files, this all works in chrome but still web fonts DO NOT work in firefox and IE.

What am I missing?

Upvotes: 0

Views: 2235

Answers (1)

Jimothey
Jimothey

Reputation: 2434

I managed to solve this by base64 encoding the fonts in the the CSS. Hope this helps someone.

Upvotes: 1

Related Questions