I have this folder structure:


Here is the content.opf:

<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<package xmlns="http://www.idpf.org/2007/opf" unique-identifier="bookid" version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <metadata xmlns:opf="http://www.idpf.org/2007/opf" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">

    <!-- ISBN -->
    <dc:identifier id="bookid" opf:scheme="ISBN">urn:isbn:971-1-911701-61-8</dc:identifier>
    <dc:rights>Copyright © 2020 Foo. All rights reserved.</dc:rights>

    <!-- BISAC Subject Headings List: http://bisg.org/?page=BISACFaQ -->
    <dc:subject>Religion / Philosophy / Nature</dc:subject>

    <!-- https://www.loc.gov/marc/relators/relacode.html -->
    <dc:creator opf:file-as="Foo" opf:role="bkd">Foo</dc:creator>

    <dc:date opf:event="publication">2020-07-14</dc:date>

    <!-- Language code: http://en.wikipedia.org/wiki/List_of_ISO_639-2_codes -->

    <meta name="cover" content="[COVER_NAME].jpg" />

    <!-- UUID generator: http://www.famkruithof.net/uuid/uuidgen -->
    <dc:identifier opf:scheme="UUID">urn:uuid:7d6649a0-c5cb-1aea-8b6e-08a020ac9a66</dc:identifier>
    <item id="css-fonts" href="Styles/style.css" media-type="text/css" />
    <item href="Text/main.xhtml" id="main" media-type="application/xhtml+xml" />
    <item href="Fonts/chimod.otf" id="chimod.otf" media-type="application/opentype" />
    <item href="toc.ncx" id="ncx" media-type="application/x-dtbncx+xml" />
  <spine toc="ncx">
    <itemref idref="main" />
    <reference href="Text/main.xhtml" type="text" />

Here is the style:

@font-face {
  font-family: Zh;
  font-weight: normal;
  font-style: normal;
  src: url(../Fonts/chimod.otf) format('otf');

@page {
  margin: 0;
  padding: 0;
  size: 178mm 254mm;
  color: #333;

body {
  font-family: Zh;
  color: #333;

Here is the HTML:

<?xml version="1.0" encoding="utf-8" standalone="no"?>

<html xmlns="http://www.w3.org/1999/xhtml">
    <link rel="stylesheet" href="../Styles/style.css"/>
  <body><span class="f-zh q">二</span></body></html>

Why isn't the font loading and displaying when I open the Epub?

I am compiling with this: https://github.com/javierarce/epub-boilerplate. I customized that to get it working. Getting no errors about resources not found. The font is the Chinese google noto font.

  • Have you validated the epub with epubcheck? What are the results? IIRC, when you use embedded fonts, it throws up some INFO/WARNINGS, but the file still validates. I assume you have checked your file paths already to make sure that is correct. – idiotprogrammer Jul 14 '20 at 14:45
  • I haven't used an otf font file, but what you have looks basically correct. (I use TTF instead). You should try another font just to see what happens... The problem may lie with the reading system you use to test render or the font itself, so it's important to rule these out... What you have looks correct so far. – idiotprogrammer Jul 14 '20 at 14:52
  • I think what you did looks correct already, but you might find this reference to be useful github.com/JayPanoz/Soma/wiki/How-to-embed-fonts – idiotprogrammer Jul 14 '20 at 14:53
  • I used Mac Books to render if that matters. – Lance Pollard Jul 14 '20 at 14:55
  • 1
    Because you did not give me the output of epubcheck, there is no way to answer the question. My guess is that you used a wrong file path. – idiotprogrammer Jul 15 '20 at 15:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.