When we are using CSS @font-face for WordPress, we usually don’t get the desired result that we may be expecting while we are using Mozilla Firefox.

Firefox 3.5 supported TrueType and OpenType fonts. In Firefox 3.6 support for a new font format – the Web Open Font Format, or WOFF is been added. You can use this font format to work for WordPress if you are using Firefox.

You can convert you fonts to woff format from http://www.fontsquirrel.com/fontface/generator

After you get your font coverted use the following code to import your fonts for all browsers.

@font-face {
  font-family: GentiumTest;
  src: url(fonts/GenR102.woff) format("woff"),
       url(fonts/GenR102.ttf) format("truetype"),
       url(fonts/GenR102.eot) format("embedded opentype");
}

Continue reading »

Tagged with:
 

embeding fonts – answer

On October 7, 2010, in Web, by Bikas

At present embedding font css is supported by Mozilla 3.5 and 3.6.

The format must be as follows:

@font-face {
  font-family: <a-remote-font-name>;
  src: <source> [,<source>]*;
  [font-weight: <weight>];
  [font-style: <style>];
}

The fonts supported must be TrueType and OpenType fonts or WOFF for mozilla.

  • Internet Explorer only supports EOT
  • Mozilla browsers support OTF and TTF
  • Safari and Opera support OTF, TTF and SVG
  • Chrome supports TTF and SVG

For more details you can visit https://developer.mozilla.org/en/CSS/@font-face

There are other ways also by which you can use fonts of your taste to match your layout design. One of them is Cufon font. There are others too but most of them are paid.

Hope this will resolve your problem.