Custom Fonts

**Note: these instructions are for the Build Your Own document type (using the Document Builder).

Giving your document a fresh and unique look can be as easy as using a custom font.  Since there are so many different fonts you can use, we only provide the basic web fonts that are available.  However, you can upload a font file (TTF), or link to it from another website, and will be used in your document.

Where can I find TTF font files

There are many online sources that you can find custom fonts that provide a downloadable TTF file.  Check out any of the following websites as a starting point.

Upload the font (if needed)

If you need to upload the TTF file, simply open the online document builder, and click the Link icon.  From this popup, you will be able to click the "Upload" tab and upload the file.  After the file has been uploaded, copy the URL that is provided to the file, we'll use that here in a second.

Let's add the font to our document

To get the font inside your document, you'll need to modify some HTML code at the top of your document.  Go ahead and click the Source button in the editor.  At the top you are going to add the following code:

<loadfont family='oklahoma' src='http://www.example.com/sweet_home_oklahoma.ttf'>
<style type="text/css">
body{
    font-family: 'oklahoma';
}
</style>

 

From the code above, you'll notice 2 important things.  The first is the <loadfont> element where you name a font family and provide a link to the TTF file.  You'll want to update this information to customize it for your document.  The second piece is the CSS that defines the font-family for the document default font.  The value that you put in the family="" attribute of the <loadfont> tag will need to match what you use in the CSS font-family setting.

I don't see the font in the editor, what's going on?

Since the font file you are uploading aren't actually a web font, you won't actually see the font in the editor.  You will need to test merge of your document to see the font in the PDF.

What about Google Fonts?'

Unfortunately, at this time we do not support Google Fonts.  We are working on a solution, but have not been able to add support for them yet.

Have more questions? Submit a request

2 Comments

  • Avatar
    Dina De Lestrange

    Hi! In certain cases, there are many versions of a font (ie. Lato Bold, Lato Italic, Lato Hairline). Is there a way to load all of the various ones such as for Lato? Or are we jumping into CSS territory?

  • Avatar
    Jeremy Clarke

    Hi Dina,

    Unfortunately, you need to load each font file separately.

Please sign in to leave a comment.
Powered by Zendesk