How do you Embed a Font?

Okay, a whole bunch of us here at herzing were bound and determined to figure out how this damn WEFT thing works to get a .EOT font file embedded on a page.

1) Install the font you want to use on your machine
2) Download/Open WEFT from microsoft at http://www.microsoft.com/typography/web/embedding/weft/
3) Cancel out of the wizard and then In the Tools menu hit 'Fonts to embed...'
4) Hit 'Add' and select the font you want
5) Hit 'Close'
6) In the Tools menu hit 'Create Font Object...'
7) In the top text box enter where you want to save the .EOT file (c:\ is fine)
8) Hit 'Edit'
***** IMPORTANT STEP ****
9) You must enter in all the roots you want this EOT file to be useable in. If your trying to use the font on page: www.BigMonkey.com/MyMonkey.html you would want to select 'http://' in the combo box and then type www.BigMonkey.com in the text box and hit 'Add'
10) repeat step 9 for any other places you may want to use the font (ie: on your test server, or c:\, or a network drive, etc)
11) Hit Finish
12) Copy the .EOT file to where you want to use it
13) in your style sheet enter the following:
@font-face
{
<!--
font-family: "<font name>";
font-style: normal;
font-weight: normal;
src: url("<path and eot file name>.eot");
-->
}

Body
{
FONT-SIZE: 12px;
COLOR: #cccccc;
FONT-FAMILY:"<font name>"
}

14) Test on another machine, or uninstall the font, and reboot your machine to test.

when you goto the web site you may have to wait for a few seconds and refresh to get the font to show after it downloads the first time.