Including custom fonts using font-face

  1. 2 years ago

    owen

    18 May 2015 Administrator

    How do you include custom font assets from a font-face generator?

    The solution was to use 'image' instead of 'url' as the source e.g

    src: image('/fonts/custom-webfont.eot');

  2. richardhealy

    18 May 2015 Administrator

    Can you give me an example on what you're trying to do?

  3. owen

    18 May 2015 Administrator

    When including a custom font via font face the font is not pulled through into the TDK or editor.

    In the CSS I have:

    @font-face {
    font-family: 'custom-webfont';
    src: url('/fonts/custom-webfont.eot');
    src: url('/fonts/custom-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/custom-webfont.woff2') format('woff2'),
    url('/fonts/custom-webfont.woff') format('woff'),
    url('/fonts/custom-webfont.ttf') format('truetype'),
    url('/fonts/custom-webfont.svg#custom-webfont') format('svg');
    font-weight: normal;
    font-style: normal;
    }

    h1, h2 etc all have the correct values for font-family. I have the custom fonts in the assets folder but they are not working with 'url'.

  4. owen

    18 May 2015 Administrator Answer

    The solution was to use 'image' instead of 'url' as the source e.g

    src: image('/fonts/custom-webfont.eot');

or Sign Up to reply!