This article is for Flatfile's Portal 2.0. If you'd like to check out the latest version of the Flatfile Data Exchange Platform, click here!
Portal 2.0 users now have the ability to implement custom fonts that are not in the Adobe or Google font libraries. To activate this feature, you will need to reach out to support@flatfile.com.
Once it is activated, you will be able to use integration => fonts inside your Portal config. The following is an example of how to add a custom font:
new FlatfileImporter('...', {
type: 'Test',
fields: [...],
integrations: {
fonts: [
{
family: 'Source Code Pro',
style: 'italic',
weight: 'normal',
src: [
{
url: `https://mydomain.com/fonts/font-path.woff`,
format: 'woff'
},
{
url: `https://mydomain.com/fonts/font-path.woff2`,
format: 'woff2'
}
]
}
]
}
}
)Some things to remember:
family, src.url and src.format are required fields
You will need to use a URL accessible from outside your local system or network in url
style accepts the following values: normal , italic, and oblique
weight accepts the following values: normal , bold , lighter , bolder or 100-900 (has to be a number).
After importing your custom fonts, set your font-family in the theme config:
{
...,
theme: {
global: {
fontFamily: 'Source Code Pro'
}
}
}