Readability's Like Table Of Content

ariefcfa · 12-13-2018, 03:25 AM

Hi,

I need help about creating Table of Contents like below:

Spoiler:

I try to look at the Calibre's Edit Book, part of the code are:

Code:

  <head>
    <title>Readability - 09/23/14</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <link href="stylesheet.css" rel="stylesheet" type="text/css"/>
<link href="page_styles.css" rel="stylesheet" type="text/css"/>
</head>
  <body class="calibre">
<h1 id="filepos212" class="calibre1">Readability - 09/23/14</h1>
<ul class="calibre2">
<li class="calibre3">
<a href="index_split_001.html#filepos1865">The Failure of the UN: Rebuilding from the Ruins</a>
</li>

and the sytlesheet.css for "calibre2" and "calibre3" are:

Code:

.calibre_2 {
    color: black;
    font-size: 0.75em
    }
.calibre1 {
    display: block;
    font-size: 1.5em;
    font-weight: bold;
    line-height: 1.2;
    margin: 0.67em 0
    }

I tried to replicate the pattern above but no succeed, the Table Of Contents is still displayed as "list" not like "table".

Please suggest me about what to do. I don't have skill in coding, only a very bit.

Thanks.

DNSB · 12-13-2018, 11:16 PM

Quote:

Originally Posted by ariefcfa

Hi,

I need help about creating Table of Contents like below:

I try to look at the Calibre's Edit Book, part of the code are:

Spoiler:

Considering the code snippet you posted uses ul (Unordered List) and li (List Item) tags, it's going to display as a list. You might want to locate a book where the table of contents is wrapped as in your sample and see how that code is written. Better yet, locate 3 or 4 books. Then it's research not plagiarism.

ariefcfa · 12-14-2018, 03:22 AM

Thanks, i have ~200 unread articles from Feedly this year and collect them into one book as an "end year archive" with Calibre's Instapaper recipe.

i try small:

Code:

<ul class="calibre2">
<li class="calibre3">
<a href="...">Article 1</a>
</li>
<li class="calibre3">
<a href="...">Article 2</a>
</li>
<li class="calibre3">
<a href="...">Article 3</a>
</li>
</ul>
(and next Article 4 with it's code)
(and next Article 5 ...)

Then transfer it to Kindle Touch but the TOC still the regular (the same).

I plan to full replicate the Readability's code, but that may take a pretty lot of effort without clue if it will work.

The process of tranfer to Kindle-Delete File-Repeat that hurt me the most

💔

HarryT · 12-14-2018, 03:29 AM

Quote:

Originally Posted by ariefcfa

The process of tranfer to Kindle-Delete File-Repeat that hurt me the most

💔

Why do that? It’s just HTML. You can test it in a web browser.

ariefcfa · 12-14-2018, 05:07 AM

Quote:

Originally Posted by HarryT

Why do that? It’s just HTML. You can test it in a web browser.

Because only Kindle displayed it likewise. I tried in Sumatra PDF, Calibre Ebook Viewer, Adobe Digital Editions, and Edge browser but they not display it as Kindle.

Later (because of your suggestion), i check the Kindle storage and found the original file format is .pobi. and Calibre automatically convert it to .epub when save to disk library. (but Calibre will convert it to .mobi if it by drag and drop). Now i know why only Kindle displaying the book differently.

I think the code must be done in .pobi. or just covert it to .pobi because i have the .docx as the source (the docx is produced by Calibre, i did that because easier for me to edit the book)

I Will take a look at .pobi topic and will move on if it take too much time. Thanks

kovidgoyal · 12-14-2018, 05:12 AM

kindles have a special periodical format. This is created using calibre's fetch news function. Not via regular conversions. It is this periodical format that has the special table of contents display.

ariefcfa · 12-14-2018, 05:44 AM

Quote:

Originally Posted by kovidgoyal

kindles have a special periodical format. This is created using calibre's fetch news function. Not via regular conversions. It is this periodical format that has the special table of contents display.

Thanks, will look into it. omg i got response from the Master.

❤

12-14-2018, 03:22 AM	#3
ariefcfa Junior Member Posts: 4 Karma: 10 Join Date: Nov 2012 Device: Kindle Touch	Thanks, i have ~200 unread articles from Feedly this year and collect them into one book as an "end year archive" with Calibre's Instapaper recipe. i try small: Code: <ul class="calibre2"> <li class="calibre3"> <a href="...">Article 1</a> </li> <li class="calibre3"> <a href="...">Article 2</a> </li> <li class="calibre3"> <a href="...">Article 3</a> </li> </ul> (and next Article 4 with it's code) (and next Article 5 ...) Then transfer it to Kindle Touch but the TOC still the regular (the same). I plan to full replicate the Readability's code, but that may take a pretty lot of effort without clue if it will work. The process of tranfer to Kindle-Delete File-Repeat that hurt me the most 💔

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Aura ONE How can I change font for table of content?	tungnm	Kobo Reader	1	10-01-2018 07:23 AM
The Grid TO - Need help with my table of content	underwarez	Recipes	4	05-25-2012 05:29 AM
Use my own Table of Content	Kniebolo	Calibre	1	10-22-2010 06:08 PM
No table of content in pdb ereader	Jonimeesermann	Calibre	0	05-21-2010 05:10 PM
Table Of Content	tomcool420	Sony Reader Dev Corner	3	03-16-2008 12:14 PM

12-14-2018, 05:12 AM	#6
kovidgoyal creator of calibre Posts: 45,345 Karma: 27182818 Join Date: Oct 2006 Location: Mumbai, India Device: Various	kindles have a special periodical format. This is created using calibre's fetch news function. Not via regular conversions. It is this periodical format that has the special table of contents display.

Advert

Advert