0

Possible Duplicate:
How to add some non-standard font to a website?

A client has sent me a .ttf file with instructions that it should be used as the font on his website that I'm working on, and for those who don't have this font should have it downloaded for them.

Is it possible (to have the font be downloaded)? If so, what's the css/javascript/anything else code to have the font be downloaded?

Community
  • 1
  • 1
Ali
  • 261,656
  • 265
  • 575
  • 769
  • 2
    [Does your client have the appropriate license to embed this font?](http://blog.themeforest.net/general/font-licensing-for-the-web/) Simply having purchased a font for desktop use **does not** always confer the right to distribute the TTF (or embedded font files generated from the TTF). Your client may not even be aware that there are licencing issues around embedding a font in a webpage, so it might be worth bringing up. – josh3736 Jan 15 '13 at 15:32

2 Answers2

3

You can embed fonts using CSS @font-face rule.

The easiest way to do this is probably to use Font Squirrel generator where you can upload your .ttf and get the font converted to formats for various browsers along with ready-to use CSS snippet and an example HTML document.

David Glickman
  • 713
  • 1
  • 11
  • 18
pawel
  • 35,827
  • 7
  • 56
  • 53
  • I tried that generator but it kept showing me the loading icon for about 5-10 minutes. What's the normal wait time for this? – Ali Jan 15 '13 at 15:19
  • Up to 30 seconds I think. I've never had to wait more than a minute. Maybe try another browser/flash plugin combo? – pawel Jan 15 '13 at 15:20
1

First define the font and give it a name.

@font-face {
    font-family: cool_font;
    src: url('cool_font.ttf');
}

Then u can use it with the defined name.

p.custom_font{
    font-family: cool_font;
}
Matthias
  • 12,704
  • 13
  • 35
  • 56