Kobo Software Disregards Ebedded Fonts in SVG Images

[MikeWV]

I have used embedded fonts inside <text> tags in some of my SVG images, some of which contain a lot of text. I'm sure I've done it properly, as the specified fonts are displayed in ADE. However, neither Kobo PC, Kobo Android or my Kobo Touch with firmware version 3.3.0 display the specified embedded fonts. (I'm viewing them as .kepub.epub.)

The fonts are in the "fonts" folder in my OEBPS, are included in the manifest and are declared in the <defs> of the SVG image files as follows:

<style type="text/css"><![CDATA[
font-face {
font-family:font-name;
src: url(../fonts/font-name.ttf);
}
]]></style>

For .kepub.epub, the Kobo software defaults to a sans-serif font for all embedded fonts, be they serif or sans-serif, and for the default serif font, i.e., if I use font-family:serif, I get a sans-serif font. For plain .epub, it defaults to a bold sans-serif font.

As .epub, I was better off with version 2.4.2 on my Touch, at least the font wasn't bold. Neither version of the firmware can handle rotated text in .ebups. However, rotated text is displayed properly in all three (PC, Android and Touch) using .kepub.epub.

Kobo says "SVG is partially supported across Kobo platforms," so I suppose that embedded fonts may be something they don't support. Does anyone know if that is the case and if so, if there is a work-around?

[DomesticExtremis]

src: url(../fonts/font-name.ttf);

Shouldn't it be src: url(../Fonts/font-name.ttf);?

Every ePUB I've seen uses an upper case first letter in the directory name.

It may not matter on a Windows machine, but the Kobo is Linux based
and will make a distinction between 'fonts' and 'Fonts'.

[JSWolf]

Originally Posted by DomesticExtremis

Shouldn't it be src: url(../Fonts/font-name.ttf);?

Every ePUB I've seen uses an upper case first letter in the directory name.

It may not matter on a Windows machine, but the Kobo is Linux based
and will make a distinction between 'fonts' and 'Fonts'.

It depends on how the directory was named. Most cases, I see it as fonts (lowercase f). Sigil does make it Fonts (uppercase F) when there are embedded fonts.

The .kepb engine is Kobo's creation. Remove the stuff that make this ePub a kePub and read it with the regular reading app that does use some version of ADE software.

[MikeWV]

Yes, the directory is ../fonts.

And yes, as a regular .epub the embeded fonts are recognized, but my tables and charts don't display correctly. The tables I can fix by embedding appropriate fonts in all of my SVG image files. The charts are another matter; their Y-axes are scrambled in .epub format. It seems like there's always something off, no matter what I do.

[JSWolf]

Did you try this ePub as a real ePub on your Kobo? That is, not as a kepub.

[MikeWV]

Yes, as a plain .epub the embedded fonts are recognized, but then I have a problem with the Y-axis titles of my charts. The Kobo .epub software reverses the characters and mangles the spacing of any rotated text, which is a know issue and apparently has been for some time.

[RbnJrg]

Originally Posted by MikeWV

I have used embedded fonts inside <text> tags in some of my SVG images, some of which contain a lot of text. I'm sure I've done it properly, as the specified fonts are displayed in ADE. However, neither Kobo PC, Kobo Android or my Kobo Touch with firmware version 3.3.0 display the specified embedded fonts. (I'm viewing them as .kepub.epub.)

The fonts are in the "fonts" folder in my OEBPS, are included in the manifest and are declared in the <defs> of the SVG image files as follows:

<style type="text/css"><![CDATA[
font-face {
font-family:font-name;
src: url(../fonts/font-name.ttf);
}
]]></style>

For .kepub.epub, the Kobo software defaults to a sans-serif font for all embedded fonts, be they serif or sans-serif, and for the default serif font, i.e., if I use font-family:serif, I get a sans-serif font. For plain .epub, it defaults to a bold sans-serif font.

As .epub, I was better off with version 2.4.2 on my Touch, at least the font wasn't bold. Neither version of the firmware can handle rotated text in .ebups. However, rotated text is displayed properly in all three (PC, Android and Touch) using .kepub.epub.

Kobo says "SVG is partially supported across Kobo platforms," so I suppose that embedded fonts may be something they don't support. Does anyone know if that is the case and if so, if there is a work-around?

In principle, it seems you did it all ok, but do the try with the following declaration:

<defs>
     <style type="text/css">
          <![CDATA[
        	font-face {
	            font-family: "FontName";
	            src: url("../fonts/FontName.ttf");
	        }
          ]]>
     </style>
</defs>

As you can see, I only added quotes and suppressed a dash in the font name (and also added quotes in the path). Sincerelly, I don't think that that will fix your issues but you won't lose anything by trying it

Regards

[MikeWV]

RbnJrg,

I tried what you suggested but it had no effect. The embedded fonts are still ignored by Kobo PC, Kobo Android and Kobo Touch 3.3.0 when the extension is .kepub.epub and they are still recognized by Kobo Touch with just the .epub extension. The embedded fonts are also recognized by KDE.

I read someplace yesterday or the day before that the KEpub firmware is based on KDE. If that's correct, it makes no sense that the fonts would be ignored by my Kobo touch when reading a .kepub.epub. But I suppose that Kobo could have made too many modifications to the Adobe software.

[DomesticExtremis]

It sounds like the problem is in the rendering engine. Kobo has two, triggered by the file extension.
.epub uses the ADE (afiak) epub2 level rendering engine, .kepub uses the epub3 level engine from somebody else.
I'm guessing there's no cure for your problem until Kobo release a firmware with an updated epuib3 renderer.

[MikeWV]

My memory failed me. I was thinking that .kepub was based on ADE. Now it makes sense that the .epub is displaying properly, with the exception of rotated text. I can stack the Y-axis titles and embed the appropriate fonts in the SVG images for .epub and everything should be OK. I just tried that with a table and a chart and it did indeed work well. But the .kepub sounds like it's going to be a problem if Kobo insists on my making my books available in that format. I can live with the font issues but random blacked out images (another post) obviously isn't acceptable.

[RbnJrg]

Originally Posted by MikeWV

RbnJrg,

I tried what you suggested but it had no effect. The embedded fonts are still ignored by Kobo PC, Kobo Android and Kobo Touch 3.3.0 when the extension is .kepub.epub and they are still recognized by Kobo Touch with just the .epub extension. The embedded fonts are also recognized by KDE.

I forgot to mention that still there is a way for you in order to get what you want and without using embedded fonts. Just open your svg graphs in Inkscape and convert them to "path". Of that way, you still will be watching the fonts of your preference but won't need embed them. Save your "new" svg graphs as "plain svg" and you'll be able to use them as you used them before converting.

[Doitsu]

@MikeWV:I created a simple test file with an .svg image with a blackletter font.
Try opening it with both the epub and kepub readers to test their .svg support.

[MikeWV]

Doitsu,

No good! Kobo PC uses the embeded font as an epub but not as a kepub. Kobo Android disregards the embedded font in both epub and kepub. My Kobo Touch (3.3.0) uses the the embeded font as an epub, and as a kepub, I just get a big black rectangle, i.e., everything inside the margins is black. Of course, you have the size set at 600 x 800, so that explains the size of the black rectangle.

So I don't know what the Touch is doing with the embedded font but experience tells me that if I could see the text, it would not be rendered in the embedded font as a kepub. I'm still trying to figure out what's causing the black rectangles for some images but not all images.

[MikeWV]

RbnJrg,

I tried converting a chart to a path by selecting it and the using Path/Object to Path then saving it as a plain SVG. Unfortunately, all the text in the chart is stilled saved in the SVG as text.

I also tried a small table; ten cells and a two-line title. I selected all twelve text strings individually (if Inscape has a "Select All" option, I have yet to find it.) and used Path/Object to Path to convert the strings to paths then saved the file as a plain SVG. In this case, although the strings were converted to paths, the font-family and all of the other font attributes were still present in each of the paths. However, I don't see what good the attributes are doing, as the text in the strings is not included in the paths. And there are a LOT of paths...one for each character in each string! Maybe I'm missing something, but I had expected the font attributes to go away and each text string to be handled as a graphic object, i.e., a shape or a collection of shapes for each text string.

[DomesticExtremis]

Originally Posted by MikeWV

Doitsu,

No good! Kobo PC uses the embeded font as an epub but not as a kepub. Kobo Android disregards the embedded font in both epub and kepub. My Kobo Touch (3.3.0) uses the the embeded font as an epub, and as a kepub, I just get a big black rectangle, i.e., everything inside the margins is black. Of course, you have the size set at 600 x 800, so that explains the size of the black rectangle.

So I don't know what the Touch is doing with the embedded font but experience tells me that if I could see the text, it would not be rendered in the embedded font as a kepub. I'm still trying to figure out what's causing the black rectangles for some images but not all images.

One thing I have noticed is that for .kepub, embedded fonts
are ignored (for the document, can't say for svg) unless the
'Document Default' is selected in the ereader's font dialog.
This is not the case for .epub.
It might be worth your while quickly checking...