12

I have an ebook that I'm trying to make adjustments to. When I load it on my Nook Simple Touch, it has large margins, ignoring the settings on the Nook to have a minimal margin. When going through the HTML for the ebook, nothing jumps out at me as causing this large margin. After I make changes to the CSS, I need to package the files back up as an epub, copy the file to my Nook, and then see if I fixed it. That whole process is time consuming, especially since I'm testing one minor change to the CSS at a time.

Is there some software that will simulate the epub renderer of an ereader on a computer and let me inspect the DOM to see why it's maintaining large margins on an ereader?

4
  • 2
    Does it look fine on something like Calibre (or a similar epub-capable reader software/program), but just not on the Nook. If this is the case, what you are asking for is an program that can emulate specific hardware devices (in this case a Nook Simple Touch), correct?
    – Jason Down
    Commented Jan 3, 2014 at 15:40
  • @JasonDown I'll try Calibre. At minimum, I'm looking for computer-based ereader software that will let me inspect things like the margins/padding and how it'll render. At most, I'd like something that lets me simulate specific hardware devices while doing the inspection stuff as well.
    – user340
    Commented Jan 3, 2014 at 15:43
  • If it's Android-based Nook, one option may be to tear down the file tree after rooting, and find all CSS sheets that might override the ebook settings. Then copy them and apply in FireFox with Firebug or similar.
    – DVK
    Commented Jan 3, 2014 at 16:31
  • As a nuclear option alternative, simply blow away Nook's OS, turn it into Android tablet, and use your own ebook reader software. lifehacker.com/5889158/…
    – DVK
    Commented Jan 3, 2014 at 16:33

4 Answers 4

7

For editing an EPub, I would look into sigil. It has the ability of WYSIWYG editing and comes recommended by other users on this forum. It's free and open-source.

An alternative is Calibre. Editing EPubs is a bit more code-centric in contrast to sigil. It's also free and open-source.

For some comparisons between the two programs, check out this blog.

As far as an actual hardware emulator for specific eReader devices, I'm not aware of any.

5

There is no such thing. I've done extensive research. For Amazon's platform, there is the Kindle Previewer, but it has so many bugs that I think it is mostly worthless. The fundamental problem is that every device and app has their own hidden stylesheet that will override yours. None of these stylesheets are documented and figuring out what they do is painfully tedious.

Your best bet is to search for known "bugs" that people have discovered. It is quite likely that someone else has run into this behavior before (I haven't). I have toyed with the idea of building a tool such as the one you describe, but discovering the idiosyncratic behaviors of the various platforms, devices, and apps is a more daunting task than writing an app to mimic them. Not to mention keeping it up to date.

1
  • +1 Each device has it's own hidden style sheet. No matter how perfect you make it look on something such as Calibre/sigil, you still can't guarantee it will look perfect on every device.
    – Jason Down
    Commented Jan 3, 2014 at 16:12
2

To inspect the CSS rules inside the EPUB file, you can load it with a browser-based reader (for example Readium). All major browsers have code inspectors where you can modify the CSS in realtime.

For the rules that are added by the E-reader devices, I don't know a good way either. This page talks about a NOOK emulator, maybe that can help.

1
  • another option which I use frequently is the Firefox browser plugin ereader. ebooks.stackexchange.com/users/230/julian Once the ebook is loaded you can then examine the DOM using Firebug. Of course this doesn't mean it will display the same issues you are trying to track down. The Nook uses the Adobe Digital Editions rendering engine. If the CSS rules you are writing are not having any effect you could try adding the !important declaration at the end: e.g p { margin:0!important; }
    – swisstony
    Commented Jan 9, 2014 at 2:59
0

As mentioned by @Jason Down, you can use calibre.

  • To inspect the layout (like in a browser's dev tools), you can open an EPUB in calibre's viewer, then right click somewhere on the page and select Inspect.
  • To edit EPUBs, right-click on an EPUB and select "Edit Book" (second option from the bottom.)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.