In the <head> of your document, include the following files in this order:
For example:
<link rel="stylesheet" type="text/css" href="css/typeselect.css"/>
<script type="text/javascript" src="js/typeface-custom.js"></script>
<script type="text/javascript" src="fonts/nilland_regular.typeface.js"></script>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/typeselect.js"></script>
The order of these files is important. If you're experiencing problems, ensure the order of these files is correct.
Any text element that you want to replace, just give it the class "select" and set its font family to the font you wish to embed. For example, take a look at the following headline:
<h1 class="select" style="font-family: 'Linux Libertine', Georgia, serif; font-style: italic;">Your Text</h1>
This will replace "Your Text" with Linux Libertine italicized type. If Javascript is disabled (or you're using Opera), this example would fallback to Georgia. It's a good idea to specify a similar-looking backup font family.
Since inline styling is so 2001, it would be much cooler to have all those styles defined in your CSS file.
In the typeselect.css file, you may want to adjust the selection colors to fit with your site's color scheme
Lovingly created in the oven at ORANGECOAT and offered to the world for enjoyment by all.