09-13-2013, 05:10 PM | #1 |
Enthusiast
Posts: 36
Karma: 10
Join Date: Apr 2013
Device: ipad
|
Fonts and EpubCrawler
I'm using EpubCrawler to turn my InDesign file into an epub. Most everything translated well into the epub, but I'm having a few problems. The biggest issue is the fonts. I think I followed the instruction accurately, but none of the fonts I'm using in InDesign show up on the iPad.
I've copied all the fonts into a font folder, and placed that folder into the OEBPS. Then I went into the config.ini file which is in the EpubCrawler folder and did this: Merriweather Regular,21=Merriweather-Regular,normal,normal,21px Merriweather Light Italic,18=Merriweather-Italic,normal,italic, 18px Merriweather Bold,21=Merriweather-Bold,bold,normal, 21px Wood Stamp,90=Woodstamp,normal,normal, 90px Wood Stamp,50=Woodstamp,normal,normal, 50px Komika Axis=KOMIKAX_,normal,normal, 25px Should I include the fonts in the manifest in the content.opf file too? |
09-13-2013, 06:03 PM | #2 | |
Well trained by Cats
Posts: 29,817
Karma: 54830978
Join Date: Aug 2009
Location: The Central Coast of California
Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A
|
Quote:
If you are using system fonts: No. |
|
Advert | |
|
09-13-2013, 06:50 PM | #3 |
Enthusiast
Posts: 36
Karma: 10
Join Date: Apr 2013
Device: ipad
|
ok, so system fonts are just standard fonts that come with the device? (iPad, Nook)
and Included fonts would be fonts that I downloaded? |
09-14-2013, 03:20 AM | #4 | ||
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Quote:
A device might have or not its own set of system fonts, and they might be or not accessible to ebook-reading applications in the device. If you want anything portable, you should not assume any font at all will be available in a device (that is, any specific font, you can always assume there will be some default font). Quote:
|
||
09-14-2013, 04:44 AM | #5 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
And don't forget you need an additional file for fonts to show in iBooks.
|
Advert | |
|
09-14-2013, 12:27 PM | #6 |
Grand Sorcerer
Posts: 11,470
Karma: 13095790
Join Date: Aug 2007
Location: Grass Valley, CA
Device: EB 1150, EZ Reader, Literati, iPad 2 & Air 2, iPhone 7
|
And don't forget that some fonts are copyrighted and you may need permission to include them in an eBook.
Dale |
09-14-2013, 05:46 PM | #7 |
Enthusiast
Posts: 36
Karma: 10
Join Date: Apr 2013
Device: ipad
|
so I made sure to list the fonts in the manifest and it still doesn't work. This is what the EPUB Validator said:
and this is my manifest I can't see what I'm doing wrong Last edited by krausj; 09-14-2013 at 05:48 PM. |
09-14-2013, 06:05 PM | #8 |
Grand Sorcerer
Posts: 5,584
Karma: 22735033
Join Date: Dec 2010
Device: Kindle PW2
|
The last two font definitions lack the .otf file extension in the .opf file.
BTW, in the future, please do not post code as images. Use [CODE] tags instead and wrap long listings in [SPOILER] tags. |
09-15-2013, 01:01 AM | #9 |
Enthusiast
Posts: 36
Karma: 10
Join Date: Apr 2013
Device: ipad
|
ahh thanks! I can't believe I missed that. Yeah I won't post images next time sorry about that. Well, I fixed the code and the fonts still don't show up. Very confused on this one
|
09-15-2013, 01:25 AM | #10 | |
Grand Sorcerer
Posts: 5,584
Karma: 22735033
Join Date: Dec 2010
Device: Kindle PW2
|
Quote:
To further investigate this, open any .html source file, post a typical paragraph (<p class="abc">....</p>), the corresponding style (p.abc { ...}), and the font reference (@font-face { ... }) of the font used in the style. You could also try to experiment with the free Kindle plug-in and create an ePub from the source files that it creates. |
|
09-15-2013, 02:55 PM | #11 |
Enthusiast
Posts: 36
Karma: 10
Join Date: Apr 2013
Device: ipad
|
ok here are some snippets. I don't have any @ symbols in any files. EpubCrawler creates an OEBS that's a little different from ones you make by hand, so that's where it gets confusing. There are a lot of "overrides" which I don't understand. I guess it has something to do with what I did in text in InDesign, but all the text has a paragraph style and/or a character style.
Code:
<div id="BG_p9"><img src="images/BG_p9.jpg" alt="p9" /></div> <div id="p9-2"><p class="Override8">CHAPTER TWO: Curt & Deb</p> </div> <div id="p9-3"><p class="TAGLINEP">()</p> </div> <div id="p9-4"><p class="ParagraphStyle1P"><span class="firstwordC"><span class="Inline9"> “Jesus Theo,</span></span> quit it or you’ll get us all killed!” Deb shouted as they screeched into the new driveway. Theo seemed determined to do a barrel roll out of the moving car. “From now on you’re wearing a helmet when we’re in the car. And not one of those cool skateboarding helmets either. You’ll look...SILLY!”</p> <p class="ParagraphStyle1P"> “He’s just excited,,” Curt said. “It’s a trampoline. No, a GIANT trampoline. I might even try it myself.”</p> <p class="ParagraphStyle1P"> “Why did you even tell him about the trampoline?” she murmured. “That’s like catnip for him. You know how he is.”</p> <p class="ParagraphStyle1P"> “Deb I really don’t like when you compare him to a cat,” Curt said. “Contrary to what the internet would have you believe, cats are the sociopaths of the animal kingdom. Theo’s more like a lemur, bouncing and swinging and-”</p> <p class="ParagraphStyle1P"> “Throwing his poop at the mailman?”</p> <p class="Override9 ParagraphStyle1P"><span class="Inline10"> Curt sighed. “Give him a break. I feel like you’re forgetting all the times he </span><span class="Inline11">didn’t </span>throw his poop at the mailman.”</p> </div> </body> </html> Code:
.ParagraphStyle1P { font-family: "Merriweather Regular"; color: #000000; font-size: 21px; font-style: normal; font-weight: normal; text-align: justify; line-height: 32px; text-indent: 0px; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; -webkit-margin-before: 0; -webkit-margin-after: 0; /* name: Paragraph Style 1 fontMatchString: Merriweather Regular,21 |
09-15-2013, 03:20 PM | #12 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
The "overrides" are just class names like any other.
If you don't have a @font-face, there's no way the ebook reader will know which font file to use when you say "Merriweather Regular" (no, even if the font is named exactly like that, readers are not that smart). @font-face rules provide a link between the family name you use in font-family and the actual file embedded in the ePub (and listed in the manifest). Without that, it may work in web pages (because browsers in a computer have access to all fonts installed, and the computer keeps an index of which font name corresponds to which file), but not in an ePub. |
09-15-2013, 06:23 PM | #13 |
Enthusiast
Posts: 36
Karma: 10
Join Date: Apr 2013
Device: ipad
|
ok so I need a font face. This is an example of what the fonts look like in my template. Do I change this, or replace it with something else?
Code:
.Override1 { font-family: "Wood Stamp Regular"; color: #55A17B; font-size: 90px; font-style: normal; font-weight: normal; text-align: left; /* line-height: inherited; */ text-indent: 0px; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; /* name: Override1 fontMatchString: Wood Stamp Regular,90 fontStyleName: Regular postscriptName: WoodStamp name: Wood Stamp Regular fontFamilyName: Wood Stamp fontStyleNameNative: Regular platformName: Wood Stamp fontFile: C:\Users\Stumpy O'donnel\Desktop\Theo Battles The Stair Monster\InDesign\RightPageOrder\OEBPS\fonts\Woodstamp.otf fileName: Woodstamp.otf fullNameNative: Wood Stamp fullName: Wood Stamp calculatedFontName: Wood Stamp Regular calculatedFontStyle: Regular isItalic: false isBold: false fontSize: 90 appliedFont: Wood Stamp Regular fontStyle: Regular pointSize: 90 leading: AUTO capitalization: NORMAL underline: false strikeThru: false noBreak: false horizontalScale: 100 verticalScale: 100 baselineShift: 0 skew: 0 */ } |
09-16-2013, 03:16 AM | #14 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Everything between /* and */ is a comment, and you can remove it. It's probably only used by InDesign to store some of its settings.
|
09-16-2013, 04:08 AM | #15 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
You really need to add a @font-face declaration before they can work.
|
Tags |
epubcrawler, font, fonts |
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
How to add alternate fonts without replacing system fonts.(this time this is a guide) | techiemonkey | Kindle Developer's Corner | 17 | 09-12-2012 04:55 PM |
An Observation on Fonts - Improving readability by using *bold* versions of fonts | nesler | General Discussions | 12 | 06-24-2012 12:33 PM |
need the fonts in /usr/java/lib/fonts of kindle touch5.0.0 | hanpal | Kindle Developer's Corner | 1 | 02-20-2012 10:40 AM |
Troubleshooting need the fonts in /usr/java/lib/fonts of kindle touch5.0.0 | hanpal | Amazon Kindle | 0 | 02-20-2012 08:51 AM |
Touch Fonts question (special characters in stock and custom fonts) | levil | Kobo Reader | 20 | 09-23-2011 01:51 PM |