How to remove embedded fonts?

[Ebby]

Hello,

I'm completely new to the html and css so if somebody could help me I will be very happy.

I have some ebooks which not let me change the font on my ereader. I think it is because there is some embedded fonts. I suppose there must be a way to change something on the stylsheet, etc. on Sigil to allow me to read those books with the font I like on the reader.

I will like to know what is the coding difference between the books who have embedded fonts (so you can't change the font on the reader as you like) and the other who let this choice possible? I mean where on the css code and what exactly.

P.S. I don't really understand the utility of embedded fonts on the ebooks as when I'm reading them on my Prs-t1 choosing the font "original" the fonts are always the same (I mean not the one who is embedded to the code) on all books?

[theducks]

Originally Posted by Ebby

Hello,

I'm completely new to the html and css so if somebody could help me I will be very happy.

I have some ebooks which not let me change the font on my ereader. I think it is because there is some embedded fonts. I suppose there must be a way to change something on the stylsheet, etc. on Sigil to allow me to read those books with the font I like on the reader.

I will like to know what is the coding difference between the books who have embedded fonts (so you can't change the font on the reader as you like) and the other who let this choice possible? I mean where on the css code and what exactly.

P.S. I don't really understand the utility of embedded fonts on the ebooks as when I'm reading them on my Prs-t1 choosing the font "original" the fonts are always the same (I mean not the one who is embedded to the code) on all books?

Embedded fonts can be cool (if used appropriately and sparingly ).
Not all readers support font embedding. Does that mean that all books should not use them?

YOU can choose to remove the font files (in Fonts) which would simply leave a technically, 'broken' EPUB.
Removing the @font declarations from styles (AND the named font, from the font-family: (priority) list in the styles section or CSS should take care of the rest.
Flightcrew should tell you if you missed all but the styles part.

BTW The Calibre: Modify EPUB plugin will do this https://www.mobileread.com/forums/sho...d.php?t=154371 if you use Calibre.

[Ebby]

Hi theducks, thank you very much for your answer.

Originally Posted by theducks

Embedded fonts can be cool (if used appropriately and sparingly ).
Not all readers support font embedding. Does that mean that all books should not use them?

Yes you are right, lets hope the future generation of readers will support more fonts.

Originally Posted by theducks

YOU can choose to remove the font files (in Fonts) which would simply leave a technically, 'broken' EPUB.
Removing the @font declarations from styles (AND the named font, from the font-family: (priority) list in the styles section or CSS should take care of the rest.

I tried what you were explaining here but it doesn't worked. Maybe I didn't remove all the things I should have.
Buy the way some of the ebooks don't have font files and other don't have any font-familly anywhere on the CSS.

Originally Posted by theducks

BTW The Calibre: Modify EPUB plugin will do this https://www.mobileread.com/forums/sho...d.php?t=154371 if you use Calibre.

I already tried with this plugin before but it doesn't change anything.

The only way I find to remove embedded fonts at the moment is to do a epub > epub conversion.

If you have a little of time one day I will be so happy if you could tell what is making that it is impossible to change the font on a ebook. I mean what is the formula, phrase? Maybe than I could find it on the CSS. Because I suppose one thing is to say I want the book use X font and an other thing is to say I want the book use ONLY the X fonts. I don't know if I'm clear with my poor english!

[theducks]

Let us be sure of the terms:
Font is the way a character Looks (includes the Bold, slant variants)
Font size is how big/little

Failure of the reader to resize:
1) font size is specified in absolute dimensions in the Style
2) What you see is a picture of words (you can't copy/change any word)
3) the reader software has limitatations

There are threads discussing the T1 and using System Local fonts
The solutions are all T1 centric, and make a book into non-inter-changeable device EPUB book .

[Ebby]

I think my english will not be sufficient to talk about this problem in a detailed way.

But when you are saying "The solutions are all T1 centric" is that means the other devices don't have this problem (the impossibility to change the font-family)?

I think I will continue with the solution I found (the conversion) unless I learn one day the CSS coding.

Even though I have not been able to understand all your advises (the CSS language is far too technical for my comprehension), thank you very much for taking time to respond to my questions.

[Toxaris]

If done correctly, removal of embedded fonts is not that difficult and is, as theducks already specified, a three-step.
1. removal of the fonts in the ePUB (with Sigil this is in the Fonts folder)
2. Removal of all @font-face references in the stylesheets (could be internal stylesheet, that means in the XHTML files!)
3. Remove references in styles (search for font-family).

If this does not work, there might be interal stylesheets. If you see a lot of @font-face in the XHTML documents, the source is probably a Word document which has not been cleaned up sufficiently. That is a lot more work.

Embedded fonts have their uses. The fonts on the reader usually don't contain a full character set. That means that not every character can be displayed. An embedded font can help there. Also, for certain headers, notes, signs and so on it can have added value.
A base font is usually not that useful, unless it is about the characters mentioned earlier.

Font-embedding on the Sony's can be done in two ways. One way is embedding the font in the ePUB and that will, if done correctly, work on almost all readers. The other method is by placing fonts on the reader in a specified directory and make a change in the stylesheet pointing to those fonts. These ePUB's will only work on that reader without issues.

[JSWolf]

Originally Posted by Toxaris

Font-embedding on the Sony's can be done in two ways. One way is embedding the font in the ePUB and that will, if done correctly, work on almost all readers. The other method is by placing fonts on the reader in a specified directory and make a change in the stylesheet pointing to those fonts. These ePUB's will only work on that reader without issues.

Actually, ADE is very forgiving. So if you have an ePub that has @font code pointing to the font files sitting on a Sony Reader, ADE (on a different reader) will still work. It's just that you'll get whatever the default font is. I'm not sure (depending how the code is setup) if other readers that allow font changing will work to change the font. I know if you use a font-family: serif then it will work on other readers to change fonts. But if you use say font-family: Charis, then even if the @font points to non-existent fonts I can't say if changing the fonts via the reader will work.

[aterry13]

Message deleted - I meant to start a new thread

[theducks]

Originally Posted by aterry13

Message deleted - I meant to start a new thread

You asked this over on Calibre
without failing code samples (and the CSS) you need to work backwards from the Paragraph (styles, and everyone used within; ) until you find what is killing your font use.

The big question(s) does the CSS validate 100% at W3C and does your EPUB validate. (You can have 100% valid nonsense code, so check your logic. BTDT )

[aterry13]

Originally Posted by theducks

You asked this over on Calibre
without failing code samples (and the CSS) you need to work backwards from the Paragraph (styles, and everyone used within; ) until you find what is killing your font use.

The big question(s) does the CSS validate 100% at W3C and does your EPUB validate. (You can have 100% valid nonsense code, so check your logic. BTDT )

By this you mean - did the Flight Crew and W3C come up without any errors? Yes, they both did. I am guessing that SOMEWHERE there is some sort of hidden code, but I can't find it. All the styles point to the embedded font that I want, but it just keeps coming up with a different font. What is even more strange is that I can't find a listing anywhere for the font that is coming up - else I would just change it! I know that the fonts are in the right place, etc, because the italics come up in the right font - just not the regular normal font....

[aterry13]

Would this help? I don't think so, I think it is in the code of the chapters themselves, but here is the CSS that checked out with the W3C checker as "No error found"....


.blockquote {
font-family : "Droid", serif;
display : block;
margin-bottom : 1.5em;
margin-left : 10pt;
margin-right : 20pt;
margin-top : 1.5em;
}
.calibre {
font-family : "Droid", serif;
display : block;
font-size : 1em;
line-height : 1.2;
margin-bottom : 0;
margin-left : 5pt;
margin-right : 5pt;
margin-top : 0;
padding-left : 0;
padding-right : 0;
}
.calibre1 {
font-family : "Droid", serif;
display : table-row;
vertical-align : middle;
}
.calibre10 {
font-family : "Droid", serif;
border-bottom : 0;
border-top : 0;
display : block;
margin-bottom : 0;
margin-top : 0;
padding-bottom : 0;
padding-top : 0;
text-indent : 1.5em;
}
.calibre2 {
font-family : "Droid", serif;
display : block;
}
.calibre3 {
font-family : "Droid", serif;
display : block;
font-size : 1.25em;
line-height : 1.2;
margin-bottom : 0;
margin-left : 5pt;
margin-right : 5pt;
margin-top : 0;
padding-left : 0;
padding-right : 0;
}
.calibre4 {
font-family : "Droid", serif;
border-bottom : 0;
border-top : 0;
display : block;
margin-bottom : 0;
margin-top : 0;
padding-bottom : 0;
padding-top : 0;
text-indent : 1.5em;
}
.calibre5 {
font-family : "Droid", serif;
color : inherit;
cursor : inherit;
text-decoration : inherit;
}
.calibre6 {
font-family : "Droid", serif;
height : auto;
width : auto;
}
.calibre7 {
font-family : "Droid", serif;
color : blue;
cursor : pointer;
text-decoration : underline;
}
.calibre8 {
font-family : "Droid", serif;
font-style : italic;
}
.calibre9 {
font-family : "Droid", serif;
color : blue;
cursor : pointer;
line-height : 1.2;
text-decoration : underline;
}
.cbjbanner {
font-family : "Droid", serif;
background : #eee;
border : black solid thin;
color : black;
display : block;
margin-bottom : 1em;
margin-left : 1em;
margin-right : 1em;
margin-top : 1em;
padding-bottom : 1em;
padding-left : 1em;
padding-right : 1em;
padding-top : 1em;
text-indent : 1.5em;
}
.cbjcomments {
font-family : "Droid", serif;
display : block;
text-indent : 1.5em;
}
.cbjcontent {
font-family : "Droid", serif;
display : table-cell;
padding-bottom : 1px;
padding-left : 1px;
padding-right : 1px;
padding-top : 1px;
text-align : left;
vertical-align : inherit;
width : 67%;
}
.cbjfooter {
font-family : "Droid", serif;
display : block;
font-size : 0.75em;
margin-top : 8px;
text-align : center;
}
.cbjheader {
font-family : "Droid", serif;
border-collapse : separate;
border-spacing : 2px;
display : table;
margin-bottom : 0;
margin-top : 0;
text-indent : 0;
width : 100%;
}
.cbjlabel {
font-family : "Droid", serif;
display : table-cell;
padding-bottom : 1px;
padding-left : 1px;
padding-right : 1px;
padding-top : 1px;
text-align : right;
vertical-align : inherit;
width : 33%;
}
.cbjpubdata {
font-family : "Droid", serif;
display : table-cell;
padding-bottom : 1px;
padding-left : 1px;
padding-right : 1px;
padding-top : 1px;
text-align : center;
vertical-align : inherit;
}
.cbjseries {
font-family : "Droid", serif;
display : table-cell;
font-size : 1em;
line-height : 1.2;
padding-bottom : 1px;
padding-left : 1px;
padding-right : 1px;
padding-top : 1px;
text-align : center;
vertical-align : inherit;
}
.cbjtitle {
font-family : "Droid", serif;
display : table-cell;
font-size : 1.25em;
font-style : italic;
line-height : 1.2;
padding-bottom : 1px;
padding-left : 1px;
padding-right : 1px;
padding-top : 1px;
text-align : center;
vertical-align : inherit;
}
.chapter-title {
display : block;
font-size : 1em;
font-weight : normal;
line-height : 1.2;
margin-bottom : 6em;
margin-left : 0;
margin-right : 0;
margin-top : 20%;
text-align : center;
text-indent : 0;
}
.description {
font-family : "Droid", serif;
display : block;
margin-bottom : 1em;
margin-left : 0;
margin-right : 0;
margin-top : 1em;
text-indent : 1.5em;
}
.font {
font-family : "Droid", serif;
font-size : 1.25em;
line-height : 1.2;
}
.image {
font-family : "Droid", serif;
border-bottom : 0;
border-top : 0;
display : block;
font-size : 0.8em;
line-height : 1.2;
margin-bottom : 0;
margin-left : 0;
margin-right : 0;
margin-top : 0;
padding-bottom : 0;
padding-top : 0;
text-align : center;
text-indent : 0;
}
.metadatadivider {
font-family : "Droid", serif;
border : inset 1px;
border-bottom : 1px solid black;
border-left : 0 solid white;
border-right : 0 solid white;
border-top : 0 solid white;
color : gray;
display : block;
height : 2px;
margin-bottom : 0.5em;
margin-left : 5%;
margin-right : auto;
margin-top : 0.5em;
width : 90%;
}
.title {
font-family : "Droid", serif;
line-height : 1.2;
}
.toc-preface {
border-bottom : 0;
border-top : 0;
display : block;
font-size : 0.8em;
line-height : 1.2;
margin-bottom : 0;
margin-left : 0;
margin-right : 0;
margin-top : 0;
padding-bottom : 0;
padding-top : 0;
text-align : justify;
text-indent : 1.5em;
}
.toc-title {
display : block;
font-size : 1em;
font-weight : bold;
line-height : 1.2;
margin-bottom : 3em;
margin-left : 0;
margin-right : 0;
margin-top : 20%;
text-align : center;
text-indent : 0;
}
span {
font-family : "Droid", serif;
}

Yet the eBook still comes up in some other font (which I can't find any hint of) and the font is accepted by my eReader. All my other books use this font....

[theducks]

So where is the @font(s) ?

@font-face {
font-family: "Droid";
font-style: normal;
font-weight: normal;
src:url(../Fonts/DroidSerif.ttf);
}
@font-face {
font-family: "Droid";
font-style: italic;
font-weight: normal;
src:url(../Fonts/DroidSerif-Italic.ttf);
}

Assumes the fonts are inserted (added) into the book. you need a matching one for each combination of green that is used used in the selectors

BTW if there is only 1 font family. You need only declare it in the body

[aterry13]

I am a total newbie at this - everything I learned about it I taught myself - so you are my new best friend for helping me out!

Here are the @fonts

@page {
margin-bottom: 5pt;
margin-top: 5pt
}
@font-face {
src: url(Droid-Serif.ttf);
panose-1: 2 2 6 0 6 5 0 2 2 0;
font-family: "Droid Serif"
}
@font-face {
src: url(Droid-Serif-Italic.ttf);
panose-1: 2 2 6 0 6 5 0 9 2 0;
font-family: "Droid Serif";
font-style: italic
}
@font-face {
src: url(Droid-Serif-Bold.ttf);
panose-1: 2 2 8 0 6 5 0 2 2 0;
font-family: "Droid Serif";
font-weight: bold
}
@font-face {
src: url(Droid-Serif-Bold-Italic.ttf);
panose-1: 2 2 8 0 6 5 0 9 2 0;
font-family: "Droid Serif";
font-weight: bold;
font-style: italic
}

And there is only one font family in the whole book. Does that help? Thanks!!!

[theducks]

Look at my example @font Look carfully at the src line

src:url(../Fonts/DroidSerif.ttf);

[aterry13]

You think that is it? I will give it a shot! Now I am just determined to beat this thing!! Thanks!