Ask Me Help Desk

Ask Me Help Desk (https://www.askmehelpdesk.com/forum.php)
-   Other Web Development (https://www.askmehelpdesk.com/forumdisplay.php?f=467)
-   -   Special font on a blog (https://www.askmehelpdesk.com/showthread.php?t=540785)

  • Jan 5, 2011, 04:55 AM
    FlDutchman
    Special font on a blog
    Hi there!

    I have a problem with showing the new fontface under Firefox.
    I set up a new fontface for my blog and it works fine with chrome, opera and safari (I didn't try it with explorer 'cause it sucks).

    The css code I use is like that:

    @font-face {
    font-family: 'DeliciousBold';
    src: url('http://www.*****.com/fontface/delicious-bold-webfont.eot');
    src: local('☺'), url('http://www.*****.com/fontface/delicious-bold-webfont.woff') format('woff'), url('http://www.*****.com/fontface/delicious-bold-webfont.ttf') format('truetype'), url('http://www.*****.com/fontface/delicious-bold-webfont.svg#webfont3jRkvl8J') format('svg');
    font-weight: normal;
    font-style: normal;
    }
    /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */


    And


    h1, h2, h3, h4, h5, h6 { font-family: "DeliciousBold", Arial, "MS Trebuchet", sans-serif, Verdana; color: #c0c0c0; letter-spacing: -1px; }



    The web address (www.*****.com) is NOT the address of the blog. I can't upload it directly to the blog, because the '.eot' '.woff' and '.js' are forbidden.

    So I think that's the reason that FF can't identify the font.

    Any idea?

    Big thanks!
  • Jan 29, 2011, 08:47 AM
    angelicaflorine
    @font-face {
    font-family: DeliciousBold;
    src: url('HTTP://URLTOFONT/delicious-bold-webfont.otf');
    }

    @font-face {
    font-family: DeliciousBold;
    src: url('HTTP://URLTOFONT/delicious-bold-webfont.otf');
    }



    Then, where you want to call the font:


    h1, h2, h3, h4, h5, h6 { font-family: DeliciousBold, Arial, MS Trebuchet, sans-serif, Verdana; color: #c0c0c0; letter-spacing: -1px; }






    Note: You have to make sure that you host the font on your own server. A lot of free font places have the font files, but remove them after 24 hours. Here are some more resources for you:



    The converter will allow you to upload a TTF file and convert it to EOT file. It will also provide the new EOT file for download AND CSS code for your style sheet.

    Hope this helps!

  • All times are GMT -7. The time now is 05:48 PM.