Please note that this is not a built-in feature of Upsales and it requires some coding skills. If you are not a code wizard, use Google Fonts which is supported by Upsales today.
Example page
How's it done?
Place your font's on a publicly accessible URL and then import them to your landing page using the landing page script field.
Follow these steps
- Have a font file which you'd like to use.
- Generate cross-browser support for your file using @fontface.
- From the fontface generator, you'll get your font files (.woff/.woff2) which in combination with the fontface CSS should be viable for most modern browsers.
- Upload your fonts to your file server. Make sure the URLs are publicly accessible.
- Copy the public URLs of your font files.
- Replace the placeholders and font names in the below code example with your own.
- Paste the code into your Upsales landing page script field (When editing your landing page, click the cog icon in the top right corner, a dialog with the script field appears)
- Save and preview your page. With the below example your custom font should now be used by the h1 and h2 headlines. You can off course apply the font to any text you'd like.
Code example
(Replace with your font name and URLs and paste into the landing page script field.)
<style>
@font-face {
font-family: 'your-font-name';
src: url('https://the-url-to-your-font-file.woff2') format('woff2'),
url('https://the-url-to-your-font-file.woff') format('woff');
font-weight: normal;
font-style: normal; }
body {
font-family: Arial, Helvetica, sans-serif;
}
h1, h2 {
font-family: 'your-font-name' !important;
}
</style>
Comments
0 comments
Please sign in to leave a comment.