Custom fonts in 2020

[pepak]

Hi!

I just bought my first Kobo (Libra H2O) and so far mostly like what I got. Except that I can't figure out how to make custom sideloaded fonts work. There's a number of threads discussing this topic, but most of them seem to be 5+ years old and either don't apply to the new devices or I am skipping some essential step.

What I am trying to achieve is to define three font families, one for regular text, one for sans-serif text and one for monospaced text, and have Kobo display text in any of these font families. To do so I uploaded the necessary font files, renamed so that the filename matches the internal font name, to the device's [root]/fonts directory and created a stylesheet which would reference these fonts using the url(res:///fonts/FontName.ttf) syntax. I am using the stock reader with "Publisher's default" as the selected font.

But I still can't get a proper display. I keep modifying my HTML code in any way I can think of, but most of them simply ignore my fonts, or perhaps display one font family correctly but not the others. I even tried switching from res:/// to file:///mnt/onboard, but without any success. What I would very much appreciate is:

a) either for someone who managed to get the fonts working to take a look at my files and tell me what I am doing wrong. Attached is a sample book file along with the source code and the Gentium Plus font file (the other two are simply renamed Arial and Courier New files from Windows XP).

b) or getting a set of files which work. It doesn't matter which fonts are used, as long as they are external and available, it doesn't matter what the content of the book file is. As long as I have a working example, I trust that I can adapt it to my needs.

Later one, I expect more struggle as I will be trying to get small caps to work as well, but that's step #2. For now, I need to get functioning fonts.

Thanks for any help.

[babygau]

if your font-families are recognized properly in kobo, then you could use kobo-patch to specified your custom fonts to default-fonts for each format.

[compurandom]

Once you put the fonts in /fonts the family should show up in the fonts menu when you are reading the book.

Also, if you are building the book anyway, I think you can embed the fonts in the book, but I've not tried that.

[pepak]

Originally Posted by babygau

if your font-families are recognized properly in kobo, then you could use kobo-patch to specified your custom fonts to default-fonts for each format.

Eh, what?

Originally Posted by compurandom

Once you put the fonts in /fonts the family should show up in the fonts menu when you are reading the book.

They do. But that does not help with my problem at all. At best, that makes all text appear in the selected font, but that's not what I want.

Originally Posted by compurandom

Also, if you are building the book anyway, I think you can embed the fonts in the book, but I've not tried that.

This is a possibility, but the last desperate one and I most definitely don't want to use it unless I absolutely have to.

[jackie_w]

@pepak,

You have asked a straightforward question which unfortunately has a less-than-straightforward "best" answer.

Having spent a very long time sorting out this problem for myself when I moved from Sony to Kobo, many years ago, I can probably offer some suggestions. However, in the interest of not wasting time (you reading, me writing ) answers to these questions would help.

• will you be using calibre to transfer your books?
• do you intend to read your books as standard epub or will you be using calibre (or Kepubify) to transfer them as kepub format? Font handling in the kepub renderer is different from the standard epub Adobe renderer.
• Have you given any thought to whether you may decide to use the kobopatch system to apply many and varied optional tweaks to the firmware.

[pepak]

Originally Posted by jackie_w

Having spent a very long time sorting out this problem for myself when I moved from Sony to Kobo, many years ago,

That's exactly what I am doing now.

will you be using calibre to transfer your books?

I will probably be using ebook-convert.exe to convert my HTML files to EPUB, so in this sense I will be using Calibre, but I am perfectly willing to switch to a different command-line tool, including a self-developed one. The actual transfer will be done using regular file transfers, definitely NOT using an application.

do you intend to read your books as standard epub or will you be using calibre (or Kepubify) to transfer them as kepub format? Font handling in the kepub renderer is different from the standard epub Adobe renderer.

I definitely prefer standard EPUB.

Have you given any thought to whether you may decide to use the kobopatch system to apply many and varied optional tweaks to the firmware.

Not yet. I just got the Kobo a few days ago. Once I am comfortable with it, I will definitely be exploring available mods, but not straight away. Unless patching is the only way of getting properly functioning fonts.

[DNSB]

Originally Posted by babygau

if your font-families are recognized properly in kobo, then you could use kobo-patch to specified your custom fonts to default-fonts for each format.

Originally Posted by pepak

Eh, what?

If you look in the Kobo Developer's Corner, the latest firmware patch thread would be Instructions for patching firmware 4.20.14622.

The patches referred to by babygau would be found in the librmsdk.so.1.0.0.yaml file.

Default ePub serif font (Amasis):
Default ePub sans-serif font (Gill Sans):
Default ePub symbol font (Symbol):
Default ePub monospace font:

Note that current Kobo firmware looks for courier font files in the fonts directory to use as the monospace font. So courier, courierstd or courierprime will work without patching.

Read the directions carefully.

Edit: BTW, looking at your epub, I have to ask why you include "<span class="serif1">" before each block of text since this will force the use of your "my-serif" font when you are apparently trying to display serif, sans serif and monospace?

[pepak]

Originally Posted by DNSB

The patches referred to by babygau would be found in the librmsdk.so.1.0.0.yaml file.

Default ePub serif font (Amasis):
Default ePub sans-serif font (Gill Sans):
Default ePub symbol font (Symbol):
Default ePub monospace font:

I had a look at these patches, but it seems they are only intended for the built-in fonts, aren't they?

Anyway, I saw some modifications to the CSS files there and looking at the firmware, it very much looks like I should be possible to disable some standard CSS rules and use userStyle.css instead. But before I go and do that, I want to verify that what I want can't be done without hacking the firmware.

Edit: BTW, looking at your epub, I have to ask why you include "<span class="serif1">" before each block of text since this will force the use of your "my-serif" font when you are apparently trying to display serif, sans serif and monospace?

That is of course a mistake. This is actually my 11th version of the test, one which involved adding those spans (because I read in a thread that otherwise the default rules on <p> tags would take over), and apparently forgot to overwrite the second and third one. But after a quick check, even that doesn't get me the right fonts.

[DNSB]

I took a look at the font-family declarations. Hooped is the kindest word that comes to mind.

You had:
src: url("res:///fonts/Gentium Plus-Bold.ttf")

where you needed:
src: url('res:///fonts/bold/Gentium Plus')

Logical not physical.

I'm not totally certain the single quotes instead of double quotes is needed but that's what I have in my notes. Also note the /bold/ and the name of the font not the font file name.

I've attached the corrected epub and a screen shot from my Kobo Forma.

[DNSB]

Originally Posted by pepak

I had a look at these patches, but it seems they are only intended for the built-in fonts, aren't they?

AFAIK, they also work with the add-on fonts. As noted in the patch files:

    # to another font name prefix (7 letters max.). For example, change "Amasis"
    # to "Times" to use a sideloaded Times New Roman font.

Originally Posted by pepak

That is of course a mistake. This is actually my 11th version of the test, one which involved adding those spans (because I read in a thread that otherwise the default rules on <p> tags would take over), and apparently forgot to overwrite the second and third one. But after a quick check, even that doesn't get me the right fonts.

Your font-family setup in page-styles.css was also incorrect. I attached a fixed up version to the previous message. At least, it works on my Forma with Publisher Default selected.

[jackie_w]

Originally Posted by pepak

That's exactly what I am doing now.


I will probably be using ebook-convert.exe to convert my HTML files to EPUB, so in this sense I will be using Calibre, but I am perfectly willing to switch to a different command-line tool, including a self-developed one. The actual transfer will be done using regular file transfers, definitely NOT using an application.


I definitely prefer standard EPUB.


Not yet. I just got the Kobo a few days ago. Once I am comfortable with it, I will definitely be exploring available mods, but not straight away. Unless patching is the only way of getting properly functioning fonts.

----------------------------
The easiest way to do what you want for standard epubs is by using kobopatch as outlined by @DNSB above. However, as you specifically said you didn't want to do this yet there are other options.

Serif: to customise your standard body text the normal way would be to do nothing more than selecting your chosen serif font from the [Aa] menu (rather than Publisher Default). Avoid using the CSS property font-family in your body{...} and standard paragraph classes. Specifically avoid using font-family:serif everywhere as this will force use of built-in Georgia (at least it used to).

Sans-serif: Use simple font-family:sans-serif in your epub's internal CSS file. You will also need to find a way to inject the following CSS into every epub CSS file. I'm using your choice of Arial from post #1 for illustrative purposes. It can be any sideloaded sans font you like as long as you use the exact internal fontname in the red bits.

@font-face {font-family: sans-serif; font-weight: normal; font-style: normal; src: url("res:///fonts/normal/Arial")}
@font-face {font-family: sans-serif; font-weight: bold; font-style: normal; src: url("res:///fonts/bold/Arial")}
@font-face {font-family: sans-serif; font-weight: normal; font-style: italic; src: url("res:///fonts/italic/Arial")}
@font-face {font-family: sans-serif; font-weight: bold; font-style: italic; src: url("res:///fonts/bolditalic/Arial")}

If you were using calibre's send-to-device to transfer your books to the Kobo then there is an option (Modify CSS) in the calibre Kobo driver to do this automatically, but as you're not planning to do that you'll need to find your own "convenient" method.

Monospace: If your mono font of choice has a name which starts with Courier (e.g. your post #1 example Courier New), all you need to do is use simple font-family:monospace in your epub's internal CSS file. If you want to use a non-Courier font you can add 4 more @font-faces similar to the sans-serif example above. All starting @font-face {font-family: monospace; ...}.

---------------------------------
It's been a long time since I did this way myself but I'm going to assume it still works.

-------------------------------
FYI, I'll just mention another possible approach but you may not want to do this kind of experiment yet, so I won't go into detail here. It's possible to "fool" the Kobo into using your chosen sideloaded serif and sans-serif fonts both in the books you read when Publisher Default is chosen plus throughout the whole GUI. This method is particularly suited to those whose native language is not well-handled by the built-in GUI system fonts Georgia and Avenir, e.g. Cyrillic, Vietnamese.

[pepak]

Originally Posted by DNSB

I took a look at the font-family declarations. Hooped is the kindest word that comes to mind.

Not sure why, but whatever.

You had:

src: url("res:///fonts/Gentium Plus-Bold.ttf")

where you needed:

src: url('res:///fonts/bold/Gentium Plus')

Logical not physical.

So that's that simple obvious thing I was missing! The Sony Readers always referenced actual font files, just like the regular CSS files.

Originally Posted by DNSB

I've attached the corrected epub and a screen shot from my Kobo Forma.

Thanks! There are some small mistakes there in the Monospace section, but I am sure I can iron it out with this example to use as the starting point.

[pepak]

Originally Posted by jackie_w

Serif: to customise your standard body text the normal way would be to do nothing more than selecting your chosen serif font from the [Aa] menu (rather than Publisher Default). Avoid using the CSS property font-family in your body{...} and standard paragraph classes. Specifically avoid using font-family:serif everywhere as this will force use of built-in Georgia (at least it used to).

I see. So I completely remove any Serif declaration and use a custom font instead. As long as I don't need a custom serif font for each book (which I don't), this should work fine.

Once I get it done (should be simple enough), there will probably be one more issue and that's small caps, but I will cross that bridge once I have everything else running.

Sans-serif: Use simple font-family:sans-serif in your epub's internal CSS file. You will also need to find a way to inject the following CSS into every epub CSS file.

Already solved in my book-building process.

FYI, I'll just mention another possible approach but you may not want to do this kind of experiment yet, so I won't go into detail here. It's possible to "fool" the Kobo into using your chosen sideloaded serif and sans-serif fonts both in the books you read when Publisher Default is chosen plus throughout the whole GUI. This method is particularly suited to those whose native language is not well-handled by the built-in GUI system fonts Georgia and Avenir, e.g. Cyrillic, Vietnamese.

Thanks for the info. For the moment, I will avoid this method, though, as the built-in fonts work fine for me.

[pepak]

Perfect! Based on DNSB's input, I was able to get fonts to work as I want them! Now to the more advanced stuff...

[JSWolf]

@pepak What you can do if you want is to not use @font for the serif body font and pick the font from the list of installed fonts and use the @font for the sans-serif and monospace.

You don't actually need the one for monospace. Just use any font that starts with courier and it will work when font-family: monospace; is used. The monospace font fix work with 4.20.14622. I don't know if it works with an earlier firmware.

And if the eBook does not use a sans-serf font, you won't need any @font in the CSS.