MobileRead Forums
Register Guidelines E-Books Today's Posts Search

Go Back   MobileRead Forums > E-Book Software > Sigil
Reload this Page Embedding Fonts - I'm having Difficulites

Notices

Reply
 
Thread Tools Search this Thread
Old 07-16-2013, 07:13 AM   #1
Bozana
Member
Bozana began at the beginning.
 
Bozana's Avatar
 
Posts: 11
Karma: 10
Join Date: Jan 2013
Device: PC
Unhappy Embedding Fonts - I'm having Difficulites
I'm having some difficulties. I haven't touched Sigil for embedding fonts for a long while and I sorta forgotten how. I have a stack of fonts added to the files in Sigil and saved them in the file:

Bookman Old Style Bold Italic.ttf
Bookman Old Style Bold.ttf
Bookman Old Style Italic.ttf
Bookman Old Style.ttf
Times New Roman Bold Italic.ttf
Times New Roman Bold.ttf
Times New Roman Italic.ttf
Times New Roman.ttf


And I've declared them in the page_styles.css:

@font-face {
font-family: 'Bookman Old Style';
src: url(../Fonts/Bookman Old Style.ttf);
}
@font-face {
src: url(../Fonts/Bookman Old Style Bold.ttf);
font-family: "Bookman Old Style Bold";
font-weight: bold;
}
@font-face {
src: url(../Fonts/Bookman Old Style Italic.ttf);
font-family: "Bookman Old Style Italic";
font-style: italic;
}
@font-face {
src: url(../Fonts/Bookman Old Style Bold Italic.ttf);
font-family: "Bookman Old Style Bold Italic";
font-weight: bold;
font-style: italic;
}
@font-face {
src: url(../Fonts/Times New Roman.ttf);
font-family: "Times New Roman"
}
@font-face {
src: url(../Fonts/Times New Roman Bold.ttf);
font-family: "Times New Roman Bold";
font-weight: bold;
}
@font-face {
src: url(../Fonts/Times New Roman Italic.ttf);
font-family: "Times New Roman Italic";
font-style: italic;
}
@font-face {
src: url(../Fonts/Times New Roman Bold Italic.ttf);
font-family: "Times New Roman Bold Italic";
font-weight: bold;
font-style: italic;
}

And in the stylesheet.css:

.BodyText { // Body of the book
font-family: "Times New Roman", "serif";
font-style: normal;
font-variant: normal;
font-weight: normal;
letter-spacing: 0;
position: relative;
text-decoration: none;
text-line-through: none;
top: 0
}
span.DrioCapIta { //Drop Caps for first letter of a paragraph but with italic
font-family: "Bookman Old Style Bold Italic", "serif";
font-style: italic;
font-weight: bold;
float: left;
font-size: 3em;
line-height: 0.8em;
margin-right: 3pt;
margin-bottom: -0.1em;
}
span.DropCap { //Drop Caps for first letter of a paragraph
font-family: "Bookman Old Style Bold", "serif";
font-weight: bold;
float: left;
font-size: 34pt;
line-height: 0.8em;
margin-right: 2pt;
margin-bottom: -0.1em;
}
.Heading118pt { // 1 Smaller Heading
font-family: "Bookman Old Style Bold", "serif";
font-size: 1.41667em;
font-weight: bold;
letter-spacing: -1pt;
line-height: 1.2;
margin-bottom: 12pt;
margin-left: 0;
margin-right: 0;
margin-top: 50pt;
text-align: center
}
h1.h1 { // Nearly all Chapter Headings
font-family: "Bookman Old Style Bold", "serif";
font-size: 2em;
font-weight: bold;
font-style: normal;
font-variant: normal;
margin-bottom: 12pt;
margin-left: 0;
margin-right: 0;
margin-top: 50pt;
text-decoration: none;
text-align: center;
}


I'm wondering where I've gone wrong? Anyone could kindly help me with this please?

I can attached the epub I'm working on, if needed.
Bozana is offline   Reply With Quote
Old 07-16-2013, 08:21 AM   #2
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
And what is your problem?

Anyway, maybe you should quote the filenames, or use filenames without spaces. And you should use the same font-family name for fonts belonging to the same family (different font-style and/or font-weight, and different src, of course).
Jellby is offline   Reply With Quote
Old 07-16-2013, 12:28 PM   #3
RbnJrg
Wizard
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 1,542
Karma: 6613969
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by Bozana View Post
I'm having some difficulties. I haven't touched Sigil for embedding fonts for a long while and I sorta forgotten how. I have a stack of fonts added to the files in Sigil and saved them in the file:

Bookman Old Style Bold Italic.ttf
Bookman Old Style Bold.ttf
Bookman Old Style Italic.ttf
Bookman Old Style.ttf
Times New Roman Bold Italic.ttf
Times New Roman Bold.ttf
Times New Roman Italic.ttf
Times New Roman.ttf


And I've declared them in the page_styles.css:

@font-face {
font-family: 'Bookman Old Style';
src: url(../Fonts/Bookman Old Style.ttf);
}
@font-face {
src: url(../Fonts/Bookman Old Style Bold.ttf);
font-family: "Bookman Old Style Bold";
font-weight: bold;
}
@font-face {
src: url(../Fonts/Bookman Old Style Italic.ttf);
font-family: "Bookman Old Style Italic";
font-style: italic;
}
@font-face {
src: url(../Fonts/Bookman Old Style Bold Italic.ttf);
font-family: "Bookman Old Style Bold Italic";
font-weight: bold;
font-style: italic;
}
@font-face {
src: url(../Fonts/Times New Roman.ttf);
font-family: "Times New Roman"
}
@font-face {
src: url(../Fonts/Times New Roman Bold.ttf);
font-family: "Times New Roman Bold";
font-weight: bold;
}
@font-face {
src: url(../Fonts/Times New Roman Italic.ttf);
font-family: "Times New Roman Italic";
font-style: italic;
}
@font-face {
src: url(../Fonts/Times New Roman Bold Italic.ttf);
font-family: "Times New Roman Bold Italic";
font-weight: bold;
font-style: italic;
}

And in the stylesheet.css:

.BodyText { // Body of the book
font-family: "Times New Roman", "serif";
font-style: normal;
font-variant: normal;
font-weight: normal;
letter-spacing: 0;
position: relative;
text-decoration: none;
text-line-through: none;
top: 0
}
span.DrioCapIta { //Drop Caps for first letter of a paragraph but with italic
font-family: "Bookman Old Style Bold Italic", "serif";
font-style: italic;
font-weight: bold;
float: left;
font-size: 3em;
line-height: 0.8em;
margin-right: 3pt;
margin-bottom: -0.1em;
}
span.DropCap { //Drop Caps for first letter of a paragraph
font-family: "Bookman Old Style Bold", "serif";
font-weight: bold;
float: left;
font-size: 34pt;
line-height: 0.8em;
margin-right: 2pt;
margin-bottom: -0.1em;
}
.Heading118pt { // 1 Smaller Heading
font-family: "Bookman Old Style Bold", "serif";
font-size: 1.41667em;
font-weight: bold;
letter-spacing: -1pt;
line-height: 1.2;
margin-bottom: 12pt;
margin-left: 0;
margin-right: 0;
margin-top: 50pt;
text-align: center
}
h1.h1 { // Nearly all Chapter Headings
font-family: "Bookman Old Style Bold", "serif";
font-size: 2em;
font-weight: bold;
font-style: normal;
font-variant: normal;
margin-bottom: 12pt;
margin-left: 0;
margin-right: 0;
margin-top: 50pt;
text-decoration: none;
text-align: center;
}


I'm wondering where I've gone wrong? Anyone could kindly help me with this please?

I can attached the epub I'm working on, if needed.
Try the following declarations:

Code:
@font-face {
    font-family: "Bookman Old Style";
    font-style: normal;
    font-weight: normal;
    src: url("../Fonts/Bookman Old Style.ttf");
}

@font-face {
    font-family: "Bookman Old Style";
    font-style: normal;
    font-weight: bold;
    src: url("../Fonts/Bookman Old Style Bold.ttf");
}

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

@font-face {
    font-family: "Bookman Old Style";
    font-weight: bold;
    font-style: italic;
    src: url("../Fonts/Bookman Old Style Bold Italic.ttf");
}

@font-face {
    font-family: "Times New Roman";
    font-style: normal;
    font-weight: normal;
    src: url("../Fonts/Times New Roman.ttf");
}

@font-face {
    font-family: "Times New Roman";
    font-style: normal;
    font-weight: bold;
    src: url("../Fonts/Times New Roman Bold.ttf");
}

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

@font-face {
    font-family: "Times New Roman";
    font-weight: bold;
    font-style: italic;
    src: url("../Fonts/Times New Roman Bold Italic.ttf");
}
Put all those declarations in your stylesheet.css and NOT in page_styles.css. Also, in the stylesheet.css write:

Code:
.BodyText { 
    font-family: "Times New Roman", serif;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    letter-spacing: 0;
    position: relative;
    text-decoration: none;
    text-line-through: none;
    top: 0
}

span.DrioCapIta {
    font-family: "Bookman Old Style", serif;
    font-style: italic;
    font-weight: bold;
    float: left;
    font-size: 3em;
    line-height: 0.8em;
    margin-right: 3pt;     
    margin-bottom: -0.1em;
}

span.DropCap {
    font-family: "Bookman Old Style", serif;
    font-weight: bold;
    font-style: normal;
    float: left;
    font-size: 34pt;
    line-height: 0.8em;
    margin-right: 2pt;     
    margin-bottom: -0.1em;
}

.Heading118pt {
    font-family: "Bookman Old Style", serif;
    font-size: 1.41667em;
    font-weight: bold;
    font-style: normal;
    letter-spacing: -1pt;
    line-height: 1.2;
    margin-bottom: 12pt;
    margin-left: 0;
    margin-right: 0;
    margin-top: 50pt;
    text-align: center
}

h1.h1 {
    font-family: "Bookman Old Style", serif;
    font-size: 2em;
    font-weight: bold;
    font-style: normal;
    font-variant: normal;
    margin-bottom: 12pt;
    margin-left: 0;
    margin-right: 0;
    margin-top: 50pt;
    text-decoration: none;
    text-align: center;
}
Try that code that should work. Remember, all declarations in your stylesheet.css file.

Regards
Rubén
RbnJrg is offline   Reply With Quote
Old 07-17-2013, 04:54 AM   #4
Turtle91
A Hairy Wizard
Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.
 
Turtle91's Avatar
 
Posts: 3,095
Karma: 18727053
Join Date: Dec 2012
Location: Charleston, SC today
Device: iPhone 11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire
Just a quick question:

Why are you giving h1 a class of "h1"??
h1.h1 {...}
<h1 class="h1">

why not just style h1:
h1 {...}
<h1>
Turtle91 is offline   Reply With Quote
Old 07-24-2013, 12:40 AM   #5
Bozana
Member
Bozana began at the beginning.
 
Bozana's Avatar
 
Posts: 11
Karma: 10
Join Date: Jan 2013
Device: PC
I thank for you all for your help! xoxoxo
Bozana is offline   Reply With Quote
Old 07-24-2013, 11:55 AM   #6
RbnJrg
Wizard
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 1,542
Karma: 6613969
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by Bozana View Post
I thank for you all for your help! xoxoxo
You are welcome
RbnJrg is offline   Reply With Quote
Old 07-24-2013, 01:24 PM   #7
DiapDealer
Grand Sorcerer
DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.
 
DiapDealer's Avatar
 
Posts: 27,549
Karma: 193191846
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
I'd probably recommend never ever using spaces in URLs, but that's just me.
DiapDealer is offline   Reply With Quote
Old 07-25-2013, 03:17 AM   #8
yucca
Member
yucca began at the beginning.
 
Posts: 15
Karma: 10
Join Date: Apr 2013
Location: Finland
Device: Bookeen Cybook Muse Frontlight
You are not specifying what difficulties you are having, but I presume you mean the fonts just won’t appear at all. There is a number of possible reasons. I would recommend starting from the simplest possible test, with just one typeface and nothing fancy, and using a filename that does not have spaces – naked spaces are not allowed at all in URLs by URL specifications, and the url(...) specifier uses the filename in a URL.

Note that Bookman Old Style and Times New Roman are not free fonts. You would need the copyright owners’ permission to include them.
yucca is offline   Reply With Quote
Reply

Tags
embedding fonts

« Previous Thread | Next Thread »

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
What does embedding fonts in pdf do? rplantz PDF 6 08-28-2012 12:52 PM
Fonts embedding 1drey Writer2ePub 3 06-17-2011 11:15 PM
Embedding fonts JaneFancher Calibre 14 04-10-2010 09:28 PM
Embedding fonts AprilHare ePub 6 01-02-2010 11:42 AM
Embedding fonts jash Calibre 2 09-09-2008 05:05 PM


All times are GMT -4. The time now is 01:50 AM.

Contact Us - FAQ - Guidelines - Privacy - Top

MobileRead.com is a privately owned, operated and funded community.