[Solved] Google font not working in Chrome and Safari

[papdronning]

I’m trying to use the Google font Special Elite on marensblog.dk and everything is working like a charm in IE and Firefox, but I can’t get it to work in Chrome and Safari. It skips the font and displays everything in Arial instead.

Any ideas?

[Senff]

font-family: \"Special Elite\",\"Helvetica Neue\",Arial,Helvetica,Geneva,sans-serif;

Remove the backslashes and it should be fine.

[papdronning]

But those aren’t in the CSS – it’s the browser putting them there and skipping them.

[Paulie_D]

Perhaps it’s this.

@font-face {
  font-family: 'Special Elite';
  font-style: normal;
  font-weight: 400;
  src: local('Special Elite'), local('SpecialElite-Regular'), url(http://themes.googleusercontent.com/static/fonts/specialelite/v3/9-wW4zu3WNoD5Fjka35Jm_n8qdNnd5eCmWXua5W-n7c.woff) format('woff');
}

Are you actually hosting these font’s locally? If not what is the point of the ‘local’ code?

[Senff]

But those aren’t in the CSS – it’s the browser putting them there and skipping them.

It’s not the browser that does this. A browser just interprets and shows what is being presented to it, and doesn’t change the code.

Did you enter the special font in the options of the Toledo theme (there is probably a “custom CSS” option)? Cause whatever double quotes you use in there, will be escaped by adding backslashes. Hence, if you enter this anywhere in the theme options:

font-family: "Special Elite","Helvetica Neue",Arial,Helvetica,Geneva,sans-serif;

Then it will end up in the source code like this:

font-family: \"Special Elite\",\"Helvetica Neue\",Arial,Helvetica,Geneva,sans-serif;

And Google Chrome does not like those backslashes.

If that’s the case, then I would suggest creating a static CSS file with those custom styles and just load that (unfiltered) file, instead of entering the code in the theme option.

If this is NOT the case, and you selected those fonts somewhere else in the theme (or it’s part of the theme) then you may want to contact the theme author for support.

[papdronning]

It actually is the case. I’ll try adding them directly in the css instead.

[papdronning]

That did it! Thanks

[Author]

Posts