Possible to embed fonts in CSS of .lit file?

[tanzer21]

Before I start, I'd like to say that Calibre is an amazingly awesome program!! I've been using it for a few months and am quite impressed. I apologize if there is a thread for this and I just haven't found it but, is it at all possible to embed fonts in a .lit file using the "Extra CSS" box in the Look and Feel section? I know you can for epub but is it similar for all outputs? And if not how do you get custom fonts in .lit files?

[kovidgoyal]

No, i'm afraid there's no way to embed fonts in lit files using calibre. Indeed I know of no way to embed fonts in lif files, period.

[JSWolf]

Actually, there is a way. I've done it. Not on purpose, but by accident.

I too an ePub that had embedded fonts for use on my 505. But in Firefox, the base font did display because it was one of the ones I have in my fonts directory. So, when I converted that ePub to MS Reader, the base font was the same one I had specified.

@font-face {
  font-family: "Fontin";
  font-weight: normal;
  font-style: normal;
  src: url(res:///Data/fonts/Fontin-Regular.ttf);
}
@font-face {
  font-family: "Fontin";
  font-weight: bold;
  font-style: normal;
  src: url(res:///Data/fonts/Fontin-Bold.ttf);
}
@font-face {
  font-family: "Fontin";
  font-weight: normal;
  font-style: italic;
  src: url(res:///Data/fonts/Fontin-Italic.ttf);
}
@font-face {
  font-family: "Fontin_Sans";
  font-weight: normal;
  font-style: normal;
  src: url(res:///Data/fonts/Fontin_Sans_R_45b.otf);
}
@font-face {
  font-family: "Fontin_Sans";
  font-weight: bold;
  font-style: normal;
  src: url(res:///Data/fonts/Fontin_Sans_B_45b.otf);
}
@font-face {
  font-family: "Fontin_Sans";
  font-weight: normal;
  font-style: italic;
  src: url(res:///Data/fonts/Fontin_Sans_I_45b.otf);
}
@font-face {
  font-family: "Fontin_Sans" ;
  font-weight: bold ;
  font-style: italic ;
  src: url(res:///Data/fonts/Fontin_Sans_BI_45b.otf) ;
}
body {
  font-family: "Fontin", serif;
  widows: 0;
  orphans: 0
}

That is the CSS used in the ePub and Fontin is installed in Windows.

[tanzer21]

Thank you both for the info. JSWolf, I'm going to give it a whirl and see if it works. Kovidgoyal, awesome work with Calibre, keep up the great updates

[tanzer21]

So I tried it but it doesn't seem to work. Is it because my fonts folder is in a different place? Would I input it then as:

src: url(res:///Windows/fonts/Fontin-Regular.ttf);

for this one?
src: url(res:///Data/fonts/Fontin-Regular.ttf);

[Stinger]

Originally Posted by JSWolf

Actually, there is a way. I've done it. Not on purpose, but by accident.

I too an ePub that had embedded fonts for use on my 505. But in Firefox, the base font did display because it was one of the ones I have in my fonts directory. So, when I converted that ePub to MS Reader, the base font was the same one I had specified.

Spoiler:

@font-face {
font-family: "Fontin";
font-weight: normal;
font-style: normal;
src: url(res:///Data/fonts/Fontin-Regular.ttf);
}
@font-face {
font-family: "Fontin";
font-weight: bold;
font-style: normal;
src: url(res:///Data/fonts/Fontin-Bold.ttf);
}
@font-face {
font-family: "Fontin";
font-weight: normal;
font-style: italic;
src: url(res:///Data/fonts/Fontin-Italic.ttf);
}
@font-face {
font-family: "Fontin_Sans";
font-weight: normal;
font-style: normal;
src: url(res:///Data/fonts/Fontin_Sans_R_45b.otf);
}
@font-face {
font-family: "Fontin_Sans";
font-weight: bold;
font-style: normal;
src: url(res:///Data/fonts/Fontin_Sans_B_45b.otf);
}
@font-face {
font-family: "Fontin_Sans";
font-weight: normal;
font-style: italic;
src: url(res:///Data/fonts/Fontin_Sans_I_45b.otf);
}
@font-face {
font-family: "Fontin_Sans" ;
font-weight: bold ;
font-style: italic ;
src: url(res:///Data/fonts/Fontin_Sans_BI_45b.otf) ;
}
body {
font-family: "Fontin", serif;
widows: 0;
orphans: 0
}

That is the CSS used in the ePub and Fontin is installed in Windows.

This isn't really embedding the font within the .LIT though, just referencing to a system available font. A different can of beans entirely.

[tanzer21]

But if the referencing of the font lets me read it in a different font that works for me since that's what I'm trying to achieve ultimately. So maybe I should have rephrased my question in the sense that how can I get my msreader to detect a certain font rather than the preset Berling Antiqua?

[tanzer21]

So trial and error wise, I got it to work for one book but not for another, it just does the table of contents on one, so looking at the CSSstyle sheet, would I need to substitute the word "body" for something else?

[JSWolf]

Originally Posted by tanzer21

So I tried it but it doesn't seem to work. Is it because my fonts folder is in a different place? Would I input it then as:

src: url(res:///Windows/fonts/Fontin-Regular.ttf);

for this one?
src: url(res:///Data/fonts/Fontin-Regular.ttf);

I didn't make any changes in the CSS I used for my 505. It just worked. But, the font is Fontin and I used the name Fontin as the font family name. So My guess is that it's calling the correct font because I used the font's name. Try it with other fonts but use the name of the font family when you reference the font. I'm guessing that the @font declaration may have nothing to do with this.

[tanzer21]

Thanks everyone for the input, I've figured it out. It IS possible to change your fonts in .lit with this:

@font-face { font-family: "Centaur MT";
font-weight: normal;
font-style: normal;
src: url(res:///Data/fonts/Centaur MT.ttf);
}

@font-face { font-family: "Centaur MT";
font-weight: bold;
font-style: normal;
src: url(res:///Data/fonts/Centaur MT Bold.ttf)
; }

@font-face { font-family: "Centaur MT";
font-weight: normal;
font-style: italic;
src: url(res:///Data/fonts/Centaur MT Italic.ttf);
}

body { font-family: "Centaur MT", serif;
widows: 0;
orphans: 0
}

In this example I'm using the Centaur MT font that I have. Just substitute the font info for the ones that you want to use and it works perfectly. Thanks all for your help