Workflow : Reading Ebook(epub, mobi, azw, etc ) in Obsidian

Share & showcase
1

Since Obsidian can’t render the epub file as it does to a pdf file, the best way to read the epub ebook in the obsidian is by combining the calibre content server and iframe html.
It would be helpful for those who want to take notes from the ebook side by side using obsidian.

  1. The first step would be starting up the content server. For that go to open calibre - go to preferences - go to sharing over the net - click start server - note down the IP and port.

  2. Open obsidian and copy-paste the HTML below.

     <iframe src="http://IP:port/" width="550"height="740" border="0" frameborder="0"> </iframe>

  3. Replace the IP and port number.

  4. Go to Preview Mode.

Epub Obsidian
Epub Obsidian1920×1033 119 KB

Further help can be found here:The calibre Content server — calibre 5.17.0 documentation

Simple but Useful. Isn’t it ?

30 Likes
2

This is great. Thanks for sharing.

I think you forgot to add the HTML :slight_smile:. I tried a few iframe options but couldn’t get it to look right.

3

Do you know if its possible to use basic auth within an iframe? I have my server behind a reverse proxy so have enabled password protection on the calibre server.

4

My bad. The post is now edited. You can try this out. And let me know if it works.

1 Like
5

Sorry, I am not a developer and I have not tried using iframe by enabling the password protection on the calibre server.

Since the basic auth requires javascript to work, the above-posted Html code would not work if you have enabled password protection.

6

Out of curiosity, I just iFramed read.amazon.com and read.amazon.com/notebook and they both work great. We gotz options! I love this Obsidian place!

3 Likes
7

Building on top of this great idea, I have made some adjustments to Calibre their ‘styling’ and the iframe itself.

This is my new ‘literature note’ taking flow. Specifically when I’m ̶b̶e̶h̶i̶n̶d̶(?) in front of the computer.

This is what it looks like. Calibre Content Server on the left. Normal note on the right.

Artboard
Artboard1754×999 326 KB

:bulb: Activate Calibre’s content server in the Calibre app under “Connect/share”

This is how I added a ‘good looking’ calibre to my Obsidian:

// Styled this iframe to "fit the whole note container". Don't use Andy Mode? Try changing the top property to reveal the menu bar.
<iframe src="http://127.0.0.1:8080/" style="position:fixed; top:0; left:32px; bottom:0; right:0; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden;">
    There is something wrong with the iframe.
</iframe>

Next is fixing Calibre their front-end. Right click on an open book. Go to ‘preferences’ → ‘page layout’ and set everything to 0 except for the paged mode. Put 1s there.

image
image1029×716 32.5 KB

Hit “OK”.

Add the following CSS to “Styles” in the same menu after you right clicked.

body {
    color: rgba(255,255,255, 0.95);
    background-color: #202020 !important;
    text-align: left !important;
    line-height: 1.6;
    text-indent: 2em;
    max-width: 85ch;
    font-family: 'Georgia', serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body p, ul, ol, blockquote {
    max-width: 640px;
    margin: 0 auto;
}

blockquote span {
    font-size: 1rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: rgba(255,255,255, 0.95);
    text-align: center;
    max-width: 640px;
    margin-left: 0 !important;
    width: 100%;
    display: block;
}

[class*="calibre_"] {
    margin-left: auto;
    text-align: left;
}

That should give you a nice clean reading experience. Experiment with any of the settings and CSS to get your own preferences in here.

Let me know if I can help you with something!

Ps. The same trick with the full-screen iframe I did with https://www.powerthesaurus.org/. Now I have a built-in Thesaurus :wink: Opens with a cmd-o → Thes…

18 Likes
8

Is there a program to convert epub to markdown perfectly?
I can unzip the epub and batch convert all .htm files via Pandoc but the links inside it can’t be replaced easily. I did find and replace all of the .hml s with .md in TOC but for the rest I afraid It’s going to ruin the online links. Any idea?

9

Have you tried Convert EPUB to original unextended Markdown for free on Alldocs ?

I used it before and it worked pretty well. :slight_smile: Not sure how complex the epub needs to be before it breaks.

1 Like
10

It is not working well, the links still are made to .html files. I can’t understand how the conversion to pdf is so good but conversion to markdown is so bad. I mean markdown and html are almost the same. they should just change very little

1 Like
11

Can you make calibre highlight through that iframe? Like make calibre highlight within obsidian.

12

Yes you can. You can then export the highlights or copy the highlights as you read.

1 Like
13

That is wonderful, thank you!
This mean that user have the ability to read and highlight on calibre on mobile device! :metal:

1 Like
14

I didn’t even think of that! That makes me want to make the content server public.

1 Like
15

Somehow the iframe only work on my computer, and will not show up on my phone. If you can successfully implement this, could you please kindly share the steps to implement?

16

I am guessing that you are running the calibre server on your computer. If you are leaving your computer on and trying to access it from your mobile, you can change the src value from the 127.0.0.1 or localhost one to your computer ip address. That should allow accessing the server from your other devices.

Let me know if that worked. I thought of this approach after reading your question. :slight_smile:

17

Thank you for your advice, but Its not working.
I think the problem is Android device Obsidian/electron do not allow HTTP connection
If i just put http://IP then it show cleartext not permitted.
if i put http://user:password@IP then nothing show up, but i cannot scroll.

So i am trying to find out how to set my phone to allow http, or how calibre will use https now
Web browser on my phone can access the calibre content server, so i am guessing this is obsidian/electron security?

18

Yes. I get the same results. :frowning:

1 Like
19

In theory that shouldn’t be a problem. I’m also pulling other websites like a thesaurus in iframes.

My best bet is that your router / firewall / router’s firewall is blocking connections from outside.

Some ideas on fixing your experience:

  • open the port that your Calibre content server is ‘served’ on
  • Port forward an ‘accessible from outside’ port to the port of your local content server. (tricky)
  • turn off any protection (don’t do this for the love of your preferred deity.)
  • Serve your content server from an accessible, dedicated server.

I’ve got a ‘public’ Raspberry Pi serving Calibre Content server. Tip: My RPi has a dynamic IP so I use DuckDNS to keep the same address.

1 Like
20

Thank you for this. I just got my calibre library all set up (just to make putting epubs on my various devices easier), and then I stumbled on this which suddenly makes my “fiddling around” with calibre actually have some return on investment. :smile:

1 Like