How do you embed an .epub in a web page?

html plugins viewer epub
Chev picture Chev · Sep 14, 2011 · Viewed 11.2k times · Source

Is there a viewer or plugin of any kind that would allow an .epub document to be viewable on a web page? A Google search turned up tons of installable epub viewing desktop software but I couldn't seem to find anything for embedding this format on a web page. Perhaps you folks have some insight into this?

Answer

Rich Bradshaw picture Rich Bradshaw · Sep 14, 2011

epub files are just HTML/XML and CSS, so you could easily open the epub container (it's a zip), then parse the XML inside using a language like PHP.

It shouldn't be too difficult to do that.

The format looks like:

--ZIP Container--
mimetype
META-INF/
  container.xml
OPS/
  book.opf
  chapter1.xhtml
  ch1-pic.png
  css/
    style.css
    myfont.otf

Here's an example of the content you might find in chapter1:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  <head>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
    <title>Pride and Prejudice</title>
    <link rel="stylesheet" href="css/main.css" type="text/css" />
  </head>
  <body>
    ...
  </body>
</html>

Related questions

I need a client side browser database. What are my options

I'm creating a web site that I think must have a client side database. The other option would be to stick everything on the server at the expense of increased complexity and decreased scalability. What options do I have? Must …

Read More
Ignore javascript syntax errors in a page and continue executing the script

I develop plugins for WordPress. It uses some jquery in the user side (themes) as a jquery plugin. The problem is, when there is an javascript error with other plugins made by other autors, my plugin's javascript fails to execute. …

Read More
jquery Flexslider manual controls is not working

I am trying to implement manual controls for the "flexslider" plugin. Here's my code: <body> <div class="container"> <div class="columns row"> <div class="flexslider"><ul class="slides"> <li …

Read More