Free Consultation: +1 (888) 374 0906

Seriously it is this easy. Thanks to some great tool kits that are out there and the straight forward setup of SiteCM.

  1. Go to Font Squirrel and choose your @font-face font kit.

  2. Unpack the kit and view the css file.

  3. Copy the @font-face declaration from the top of the css file into the top of styles.css

  4. Add the font tag declaring your new font to the body declaration at the top of styles.css like so:

    body, td, p, li, input, select, textarea {

    font: 12px 'DeutschGothicNormal', Arial, sans-serif;}

    Remember to include a relevant and useful font stack because @font-face is only supported by the latest version of major browsers.

  5. Copy the eot, ttf, woff and svg files into your SiteCM css folder.

    Don't forget to also copy the license txt file!

Check the display of your font in all major browsers as this is cutting edge stuff and not all are going to render it the same.
Works in these versions or higher of the following browsers: IE7, FF3.5, Safari 4.0, Opera 10, Google Chrome (iffy)

cross browser @font face

Font Squirrel
CSS @ Ten: The Next Big Thing
Write A Comment

Post A Comment


Follow Us:


eCommerce that works the way you want it to.

Learn more!



SiteCM Solo + Membership

View Case Study