Tuesday, November 2, 2010

Editing EPUB files right in the iPad

Rick Gordon has long touted his method of editing EPUB files right in a jail-broken iPad. But I've been too chicken. But I am finally getting caught up with some reading I needed to do and found this great article by Keith Fahlgren over on the ThreePress blog (which you should definitely also follow, if you're into EPUB). The article explains how to use the iPhone Explorer program to access the XHTML and CSS files on your iPad to facilitate updating EPUBs. And it's awesome.

Digging around a bit, I found that Macroplant, the folks who wrote iPhone Explorer, also created a little program called Phone Disk, that usually costs $10 but is free until December 1. It's even better than iPhone Explorer. What it does is show you the contents of your iPad (or iPhone or iPod) as if it were any other external drive. Check this out:

Phone Disk

You'll notice that there is a Books folder inside the iPad (mine's ambitiously called, “Firstpad”) and that within the Books folder are a series of folders with cryptic names, all ending in .epub. Although you can open up the Books.list file to see which cryptic code is related to the book you're interested in, I find it faster to list the books by Date Modified. That way, the one that I'm working on is always at the very top.

According to Macroplant, you should be able to double-click on a file and open it, and that works for
me with XHTML and CSS with TextEdit, but curiously not with BBEdit, my editing tool of choice, which acts like it's hung before recovering and showing you the file, making it too slow to be useful.

Thankfully, the folks at Barebones gave me a solution. They say that BBEdit looks like it's hanging because it's checking for a few files, and that on a remote file system like the iPad, it takes a longer time. To fool BBEdit into not worrying about where it is, you have to create two empty text files, "bbedit.bbeditSettings" and "tags", and place them in the EPUB folder whose book you want to edit. Now when you click an XHTML or CSS file, it'll open right away in BBEdit.

Add BBEdit files

After you make and save changes in the XHTML file (or CSS), you'll need to close and reopen the book on the iPad to see how the changes look. But this is nothing compared to rezipping, dragging, waiting for it to sync, opening it back up again and so on. It will save you a lot of time.

When you're done testing and adjusting your EPUB file, you need a way to get it out of the iPad so you can distribute it. First, be sure to eliminate both of the BBEdit files that we added. I like to drag them out to the Books level so I'll have them for the next book I'm working on. Then, delete the iTunesMetadata.plist file (which Apple annoyingly adds to your EPUB) as well. It seems like you should then be able to sync the iPad with your Mac via iTunes and then drag the EPUB file out to your desktop but I haven't been able to get that to work (the newer EPUB from the iPad doesn't ever get to the iTunes library).

Instead, still using Phone Disk, drag the entire EPUB folder from the iPad out onto the desktop, and then zip it back up with Terminal. (You remembered to delete the special BBEdit files and the iTunes Metadata file, right?)

Being able to make edits directly to your EPUB on the iPad (or an iPhone) is a huge time saver. Thanks, Keith, for getting me started on this.


  1. Hi Liz!

    I demo'd this exact procedure during my ID to iPad webinar for Adobe last week. I thought I had learned it here! ;-) (you must have mentioned it before)

    You can see the webinar recording here:

    you said "Although you can open up the Books.list file to see which cryptic code is related to the book you're interested in, I find it faster to list the books by Date Modified. That way, the one that I'm working on is always at the very top."

    I showed during the demo that you can open the .plist for the books right in TextWrangler (what I normally use) and see the cheat sheet ... which titles are which weirdly-coded entry in the Books folder.

    In the webinar handout I included a link to Macroplant's site, among others. (And the last page of the handout is all about your upcoming InDesign > EPUB webinars of course ...)

  2. Great webinar, Anne Marie. Thanks for all the mentions!

  3. I have been using Phone Disk in this way for a bit... it's great. But I have had very odd results when I try to edit on the ipad itself. Instead, I find it more reliable to drag the file out into a temp folder I keep on my drive, edit it, save it, then drag it back into the ipad.

    I also usually quit and restart iBooks each time I do this. Just closing the book and opening it usually works, but sometimes it doesn't (again, "very odd results").

    This is also how I use Springy (drag out, edit, drag back).

  4. I also have used Phone Disk to make changes directly on the iPad. This is certainly a good way to get things right before packaging up again ready for distribution. The editor that I use is TextMate on the MAC and that will open the files up directly with a double click. TextMate doesn't add any mystery files and can be set to open the whole set of files as a 'project' and even edit the TOC and manifest easily.

    The problem with editing the CSS directly on the iPad is that you may not see the results even if you close the book (go back to the library) and then open again, so in some ways the method is rather pointless. However, if you stick a question mark and a version number after the link like this: link href="template.css?54" rel="stylesheet" type="text/css" (changing each time you make a change) then your testing on the iPad is a bit more reliable. TextMate in 'project' mode allows you to make global changes across all of the XHTML files.

  5. Very good article, for a book or two is good. As a process for people like me who deal with 100s of books a bit of a problem

  6. Vicky, I think this method is most useful for: a) final tweaking of a book; and b) editing a css that you are going to be using repeatedly. In other words, you can tweak the css until you get it right, then copy it out and use it for your other 100s of books.

  7. Hello Liz,
    I used the "div.keep/display: inline-block;" (written in your epub-book page 156) for a picture with 2 lines of text, formated as "center". But if I use the "div.keep", I lost the center formating. I try now 2 hours, but find nothing in the web, what helps. Do you have an tip?

  8. A tip from a designer.
    You wrote in an earlier posting, you have to layout your book 2 times, one with CMYK pictures - for print, one with RGB pictures - for epub.

    You can use only one version with RGB-pictures and if you do the PDF export for print, you can convert it directly (with the same algorithm as Photoshop) in CMYK. If you need help, I can send you a profile (.joboption) for InDesign, to do this.
    So you can save time and use only one InDesign layout version for all things.

  9. Wohoooo! What a relief! Thank you so much, Liz! :)


More of my books