Emil.Sjoberg
(Emil_mauritz@hotmail.com)
March 23, 2018, 11:13am
1
Hi,
In this font there are both old-style figures and lining figures. Some letters are also changeable like the small A. My question is if it’s possible to change which one to use inside webflow? If not how do I change the font to use desired glyph as standard before uploading it?
Thanks,
Emil
samliew
(webflowexpert.com)
March 23, 2018, 11:23am
2
Please upload the font file here…
perkristian
(Per Kristian Grindeim)
March 23, 2018, 12:03pm
3
If you want to do this in Webflow you have to use custom code for now.
See: https://prowebtype.com/styling-opentype-fonts/
_I have made this a wishlist item, go and upvote it here
https://wishlist.webflow.com/ideas/WEBFLOW-I-1167_
Emil.Sjoberg
(Emil_mauritz@hotmail.com)
March 23, 2018, 12:45pm
4
@samliew That I can’t do for licensing issues.
Emil.Sjoberg
(Emil_mauritz@hotmail.com)
March 23, 2018, 2:06pm
5
Sadly I’m not getting it to work with .otf but .ttf works perfectly. Thanks @perkristian
So for anyone wanting to do this in the future it’s:
<style> .YourClass {
font-variant-numeric: lining-nums; /* high-level property */
-moz-font-feature-settings: 'lnum'; /* low-level (old Firefox) */
-webkit-font-feature-settings: 'lnum'; /* low-level (old Webkit) */
font-feature-settings: 'lnum' on; /* low-level (all new browsers) */(
}
</style>
1 Like
An easy way to do this without using custom code is by using the Fontsquirrel webfont generator: Create Your Own @font-face Kits » Font Squirrel
When you select ‘expert’, this tool allows you to ‘flatten’ certain features, so that they become the default.
Where do you place this code? Could you provide a screen shot of it in the correct environment for reference?
Sonja
(Sonja Bre)
April 8, 2022, 11:45am
8
Hey, I did this – but the files I get are .css.
How do I upload this to webflow? I was expecting a font format like .otf or .ttf