Hosting fonts

Usually I just use Google Fonts for my Twine games, but now and then there’s something particular that I want that I can’t find among Google’s options. The alternative in these cases seems to be to host the font yourself, but I don’t have my own domain or anything. Is there anywhere you can host fonts for free? I tried googling this, but the Twine use case seems to be too niche—normally the only reason you’d want to host a font is if you have a website you want to use it on, which definitionally means you have somewhere to host the font.

3 Likes

I may be talking about something you already described or I may be incorrect, but I believe that if you include a font as a .ttf file in your zipped folder, you can include that font in the css files.

If you need a single document, there may be a way to just include all the data of the .ttf file, but it would like really ugly, I expect. I know itch and IFComp both allow zip folders, though.

Edit: Here’s an example online:

<html>
<head>
<style> 
@font-face {
  font-family: myFirstFont;
  src: url('C:\Users\Jon\Desktop\zz\clights.ttf')  format('truetype');
}

div {
    font-family: myFirstFont;
}
</style>
</head>
<body>

<div>Test123</div>

</body>
</html>
3 Likes

I legit did not know that that was a type of file Twine let you include. I feel a little silly now.

1 Like

From what I understand (I’m not sure), it’s not Twine specifically that lets you do it, it’s just HTML. If you get it to work, let me know because I haven’t actually tried this!

2 Likes

I’ll try it out later and report back!

Hi! For Twine, you can put the import in the StyleSheet, using the font-face!

I made a tutorial a while back for SugarCube, which would also work for other formats. I also put it in the guide I made too.

Essentially:
Put the @font-face in the Stylesheet (Twine)/ css file (Tweego) with a relative URL linking the font file (.ttf/.otf/other) to the html one. Zip all the files together. And you’re done!

1 Like

Sorry if I’m being dumb (still/again/some more) but this is basically the same as what Mathbrush said, right? Put the ttf file in the zip file and then use @font-face in the story CSS? Or am I missing something?

Something that may help you…

https://intfiction.org/t/harlowe-thinking-outside-the-box/61328/6

…I’ve also shared a method for embedding local font files that don’t require them to be hosted, but work the same locally and online. You’ll have to go down a bit of a rabbit hole, but I’ve laid out the steps.

1 Like

Oh :joy:
yeah, it’s essentially that, but the links have a step by step with examples for SugarCube specifically (it should work with Harlowe, save for the JAvaScript).

1 Like

I appreciate the guide! I just wanted to make sure I wasn’t having a moment of reading comprehension failure and missing some important difference between that and the answer I’d already received.

Oh no worries, happens to me too. Just glancing through previous posts and not digesting what’s been said :joy:
Sorry bout the confusion!

1 Like

Note that a .ttf font is uncompressed, but can be processed into a .woff2 font for the web.

Like anything, only upload it/include it in your game if you can legally do so. There are many open source fonts that aren’t on Google Fonts, but there are also many commerical fonts which you wouldn’t legally be allowed to include in your game.

2 Likes

All of my cover art is made up of edited stock images, so I’m very familiar with the process of checking the license info before I use/redistribute something, but thanks.

4 Likes