Easier EPUB Experimenting and Updating in iBooks
by Keith Fahlgren
[Update: Liz Castro has an even easier post on editing EPUB files directly on the iPad.]
The arrival of iBooks this year helped many people understand that ebooks were already capable of interesting experimentation, multimedia, and nuanced, thoughtful design. Many of iBooks’ strengths come directly from the fact that they wisely chose to base it on WebKit, the rendering engine core used in desktop browsers like Safari & Chrome and mobile browsers for the iPhone, iPad, Android, and now Blackberry browsers. This makes it an attractive test platform for folks developing new and innovative content in EPUB, but many have been frustrated with the time and effort it takes to update EPUB content in iBooks on an iPad using the iTunes sync. This post outlines an easier approach for iteratively developing and testing changes to EPUB XHTML and CSS files in iBooks (1.1.2) without using iTunes.
Here’s a tweak to the XHTML of a chapter and the CSS used for h1s that I did quickly without having to make a new EPUB or use iTunes:
The key to this hack technique is the free (as in beer) iPhone Explorer application, which exposes the contents of your iPad like a USB drive (including resources for Apps). It has both a Mac and Windows version, but I’ve only tested these instructions on a Mac. Before starting, connect your iPad to your computer and iTunes. You should not be using automatic syncing (“Sync Books” is not checked).
To get started playing with a particular EPUB, sync the file onto your iPad, open the book once in iBooks, then close iBooks. Now you’re ready to start moving the files back and forth (iPhone Explorer is all drag and drop).
- Open iBooks to your Library (not a book).
- Open iPhone Explorer (or hit Refresh if it was open, but this is occasionally flaky).
- Expand [Your] iPad->Media->Books.
- Find the
[XXXX].epubyou’re interested in and expand it until you find your XHTML content or CSS. - Drag the XHTML file or CSS you want to experiment with somewhere on your computer (perhaps your Desktop in the Finder) to edit.
- Edit the file using something you like.
- Drag the XHTML or CSS file back from your computer to the same location in iPhone Explorer.
- Say “OK” to the “Overwrite?” dialog.
- Open the book in iBooks to see the changes.
Now you’re ready to use steps 5–9 (closing the book in iBooks in between) to continue experimenting with the EPUB’s design or content.
It can occasionally be non-obvious which filename iBooks has assigned to your EPUB. Curious folks will want to play around with some of the other resources exposed in addition to the exploded EPUBs (check out Books.plist).
Comments
Thanks! This is much better than going through itunes and having to delete the added metadata file later. S
Wow. You just made it—seriously—five times faster to develop ePubs. The amount of time that I spend resyncing my iPad to view changes (and then resyncing, when the updated version mysteriously fails to sync) is just absurd. I mean, yeah, go WebKit, but the reality is that every e-book requires many hours of tweaking on the screen of the iPad in order to get it right. Thanks so much for sharing this hack, Keith!
With a jailbroken iPad, you can cut a couple more steps out of this:
To start with, edit with an editor like BBEdit which can open via FTP/SFTP; or edit with your chosen editor via an SFTP client like Transmit or Cyberduck. SFTP to your iPad.
1) Now, simply open the files you want to edit, make your change(s), and save.
2) Close and reopen iBooks.
3) Repeat as necessary. The only changes that require resyncing the book involve those that affect iTunes metadata and TOC changes.
This may be a stupid question, but are you saying that ipad will unzip the epub file so you can see individual html files? The screenshot gives the impression you are dragging and dropping html files. Is that right or are you still dealing with epub only
That’s right. iBooks, like Ibis Reader and many other EPUB readers, explodes the EPUB’s ZIP contents so that the individual XHTML, CSS, and other files are more accessible. The initial sync of the EPUB book from iTunes takes care of this part, allowing you to modify an individual XHTML or CSS file using the technique described rather than having to rebundle EPUBs after edits and re-sync.
Macroplant, the editor of iPhone Explorer, is offering the (usually 10$ and then supposedly easier and/or better :-) Phone Disk app for free until december 1st.
I just downloaded it, and the main difference with Phone Explorer is that with Phone Disk the iOS device is mounted just like a standard hard drive or usb key.
It has the potential to speed things even more, as steps 5 to 8 are not necessary: just edit the file directly, on the iPad.
(as always, we just need not to forget about backups, keeping versions, etc. !!)
Have you tried that workflow Keith? What are the advantages/problems you see here?
Long time BBEdit user here, love the more direct approaches identified in the comments. Thanks to all.
Bringing this level of iterative development to folks not so inclined to hacking like this is a goal that I am pursuing. One of my hopes is that Apple will add .epub output to it’s Pages application (part of iWork suite). This is an XML-based app in the first place so such a feature would not require a huge effort to implement. Of course, it should enable both rich media via HTML 5 tags and interactive features, all in a WYSIWYG environment. Or should I instead wish for a separate, EPUB-dedicated app along the lines of Storyist?
Thoughts?
Thanks for the tip. I noticed in Ubuntu that my iPad pops open a window just like any other USB drive. I’ve seen the Books directory and the exploded EPubs but was afraid to muck with anything.
Out of curiosity, are DRMed books exploded and in plain text?
“Are DRMed books exploded and in plain text?”
No, the DRMed books are exploded but individual chapter files are encrypted. Even the stylesheet is encrypted, and that’s a pity because it could be a nice educationnal and convergence tool.
The free excerpts I downloaded are DRM-free, and can be studied. I’m not sure if all free excerpts are DRM-free.
Now I’m sure this is a silly questions… but how on earth do you know which book it is you’re editing using the directory structure titles? XHGD.epub isn’t terribly helpful…
@Matthew: You can find a better mapping between the shortened name for the EPUB and one you may recognize in the
Books.plistfile, although it can itself be difficult to interpret.We’ve run into a problem with iBooks 1.1–in formatting epub files, we are unable to get any type of background image to work; I think I read somewhere on the ‘Net that @lizcastro said that this had “broken” in 1.1. We can get this selfsame css to work in every other epub-reader possible, from Lucidor to FF EPUBReader–but not iBooks. I’ve sideloaded the thing more times than I can count, and it renders the image as one “page” and the text as the next page.
I scoured @lizcastro’s epub on the topic (Epub Straight to the Point), and although she asserts that background colors are possible, there’s naught about using a background image inside the epubs for iBooks. Anyone have any success with this, because we certainly aren’t. We produce a lot of epubs–this isn’t our first rodeo–but this has us scratching our heads.
Any thoughts?