Working with Fonts - Unclassified NewsBoard

NFG

2009-07-20, 10:31 #1

Member since Sep 2006 · 120 posts
Group memberships: Members

Show profile ·

Link to this post

Subject: Working with Fonts

A while back I created an arcade font machine, and I put it to good use on my UNB forum, displaying usernames in glorious 8x8 pixel fonts. Recently, with the release of modern browsers like Opera 10 and Firefox 3.5, it became possible to use TTF/OTF/etc fonts in webpages. So I put those to good use also. Here is my guide to adding these features to your own UNB installation.

First, the pixel fonts:

[Image: http://nfgworld.com/grafx/throwaway/new-font-2.png]

Simply open /unb_lib/designs/modern/post.html and replace {$post.authorName} with <img src="http://yourserver.com/path-to-NFGscript/arcade.php/y-rf/z-3/dbl-2/x-{$post.authorName}" />

Next, custom truetype fonts, using CSS:

[Image: http://nfgworld.com/grafx/throwaway/new-font-1.png]

Just add the following to your user.css.php file:

@font-face {
font-family: Border;
src: url(/path-to/fonts/borderheaven.otf);
}
.post_username {
font-family: Border, Arial, sans-serif;
font-size: 16px;
color: red;
}

Finally, remember that if your users are stuck with an older, crappier browser, all they'll see is this:

[Image: http://nfgworld.com/grafx/throwaway/new-font-3.png]

(actually the pixel fonts should work fine, though without the PNG transparency, and the CSS fonts will simply be ignored).