@font-face is a css rule which allows you to download a particular font from your server to render a webpage if the user hasn't got that font installed. This means that web designers will no longer have to adhere to a particular set of "web safe" fonts that the user has pre-installed on their computer.

The basics are pretty simple to implement the @font-face rule, but it is possible to add lots of options to extend its features.

Initially you define the rule, "font-family" is what you want to call the font, "src" is where it can be found, include a "font-weight" (not needed for normal, but required by everything else, bold, thin etc).

-Create a folder called "fonts" in your theme of choice.
-Lets go here to choose our font set. Handpicked free fonts for graphic designers with commercial-use licenses. | Font Squirrel
-Pick your font and download the webfont kit.
-Upload everything to the "fonts" folder you just created.

In index.css file add...

Code Select Expand

@font-face {
    font-family: DeliciousRoman;
    src: url('../fonts/delicious/Delicious-Roman.otf');
    font-weight:400;
}

Find:

Code Select Expand

font: 78%/130% "Verdana", "Arial", "Helvetica", sans-serif;

Replace with:

Code Select Expand

font: 78%/130% DeliciousRoman, Helvetica, Arial, sans-serif;

Easy as pie.

@font-face is a css rule which allows you to download a particular font from your server to render a webpage if the user hasn't got that font installed. This means that web designers will no longer have to adhere to a particular set of "web safe" fonts that the user has pre-installed on their computer.

The basics are pretty simple to implement the @font-face rule, but it is possible to add lots of options to extend its features.

Initially you define the rule, "font-family" is what you want to call the font, "src" is where it can be found, include a "font-weight" (not needed for normal, but required by everything else, bold, thin etc).

-Create a folder called "fonts" in your theme of choice.
-Lets go here to choose our font set. Handpicked free fonts for graphic designers with commercial-use licenses. | Font Squirrel
-Pick your font and download the webfont kit.
-Upload everything to the "fonts" folder you just created.

In index.css file add...

Code Select Expand

@font-face {
    font-family: DeliciousRoman;
    src: url('../fonts/delicious/Delicious-Roman.otf');
    font-weight:400;
}

Find:

Code Select Expand

font: 78%/130% "Verdana", "Arial", "Helvetica", sans-serif;

Replace with:

Code Select Expand

font: 78%/130% DeliciousRoman, Helvetica, Arial, sans-serif;

Easy as pie.

Google Search Results Within SMF

Custom pages for your SMF forum

Team Page for SMF

Create a Custom Menu for SMF

Users on-line; cheat.