Forums

adding fonts

Permalink
How in heavens name to you add fonts to concrete5? The version I'm on is 8.5.5. I've looked at all the instructions I have found so far and nothing seems to work. It should not be this hard to add your own fonts!
 
Steevb replied on at Permalink Reply
Steevb
How r u trying to add fonts?
From Google or within the theme css?
webnf replied on at Permalink Reply
Well, I was hoping to do it within the theme. I'm not using google fonts.
Steevb replied on at Permalink Reply
Steevb
Okay, I'll post the procedure I use for theme fonts shortly.
Steevb replied on at Permalink Reply
Steevb
In the theme css folder I have a ‘fonts’ folder which contains the ‘.woff’ and ‘.woff2’ fonts. In the ‘theme.less’ file I tell c5 to use my fonts(@import ~"@{preset-fonts-file}).
@charset "utf-8";
@import "presets/defaults.less";
@import "build/body.less";
@import ~"@{preset-fonts-file}";
div.ccm-page {
@import "build/navigation.less";
@import "build/image.less";
}

In the css folder ‘build’ I have another ‘fonts’ folder and in there I have file (helvetica.less) with the path to my fonts.
@font-face {
    font-family: 'helvetica_neueregular';
    src: url('../../fonts/helveticaneue-lightext-webfont.woff2') format('woff2'),
         url('../../fonts/helveticaneue-lightext-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

In ‘css/presets/defaults.less’ I set the font for my headings.
/*Headings*/
@h1-type-font-family:  'helvetica_neueregular', Arial,  sans-serif;
@h1-type-color: #ce0a1f;
@h1-type-font-size: 2em;
@h1-type-font-weight: 300;
@h1-type-line-height: 1.5em;
@h1-type-text-transform: normal;



Hopefully that should help.
webnf replied on at Permalink Reply
Thanks...I'll give that a try. :-)