Sign in Register
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Manu Claessens 23 posts 63 karma points
    Oct 29, 2013 @ 13:53
    Manu Claessens
    0

    @font-face not working

    Hi everyone,

    I've been reading a dozen topics on implementing @font-face in Umbraco, but I can't seem to get it working. Any help would be greatly appreciated.

    I currently have the below tree in my solution:

     

    The astral-style.css file has below code:

    @font-face {
        font-family: 'FontAwesome';
        src: url('~/css//fonts/fontawesome-webfont.eot?v=3.2.1');
        src: url('~/css/fonts/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'), url('~/css/fonts/fontawesome-webfont.woff?v=3.2.1') format('woff'), url('~/css/fonts/fontawesome-webfont.ttf?v=3.2.1') format('truetype'), url('~/css/fonts/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg');
        font-weight: normal;
        font-style: normal;
    }

     

    Can anyone tell me what I'm doing wrong ?

    Big thanks!

    Manu

    Copy Link
  • Dan 1288 posts 3942 karma points c-trib
    Oct 29, 2013 @ 13:58
    Dan
    100

    Hi Manu,

    Not for any particular reason, but I always tend to do this relatively, i.e. by removing the '~/css/' (and '~/css//' where you have that) from the url. So you'd just have something like:

    src: url('fonts/fontawesome-webfont.eot?v=3.2.1');

    If this still doesn't work then I'd check to see if the style sheet is loading correctly at all. Failing that it could be something to do with the mime-types on the server not serving particular web font files correctly.

    Copy Link
  • Dan Lister 416 posts 1974 karma points c-trib
    Nov 04, 2013 @ 10:02
    Dan Lister
    1

    Hi Manu. As Dan suggests, have you got your MIME types setup correctly in IIS/web.config?

    <?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <staticContent>
      <remove fileExtension=".woff" />
      <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
      <remove fileExtension=".ttf" />
      <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
      <remove fileExtension=".otf" />
      <mimeMap fileExtension=".otf" mimeType="application/octet-stream" />
      <remove fileExtension=".eot" />
      <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
    </staticContent>
  </system.webServer>
</configuration>
    Copy Link
  • Manu Claessens 23 posts 63 karma points
    Nov 17, 2013 @ 21:37
    Manu Claessens
    0

    Hey guys,

     

    Thanks for your replies.

    After messing around alot (and trying the above feedback), I made it work!

    The mistake (as often) was simpler than I thought, the reference to my CSS file was mistyped....

    Stupid mistake, but it works so thanks guys!!!

     

    Manu

    Copy Link

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies