Set depth of [TOC]

Support
1

Is it possible to set a depth for the TOC plugin?

Currently the plugin renders all the headings in a Table of Contents. I would like to render e.g. only # and ##.

Maybe @tessus knows?

2 Likes
2

Another question about TOC: could be possible to change unnumbered TOC with numbered one?

3

@desk7 unordered was chosen as the standard for Joplin and will not be changed. However using the css customizations you can change it for yourself using the the following code (I found this on the toc plugin github page)

edit: original css changes all unordered lists into ordered lists see @desk7ā€™s reply for better css.

For reference on using custom css with Joplin check the readme

1 Like
4

Unfortunately with the way the plugin renders the table of contents, this is not a trivial change. If you have some coding skills you could try adding the feature to Joplin, I would recommend adding the heading level as a class to the toc links so that they can be selectively disabled using css. Here is a link to the toc plugin joplin uses.

That said, depending on the structure of your notes, and your tolerance for a potentially non-perfect toc, you can actually get this behavior already using css (see my previous reply for how to set that up).
Here is the css:

.table-of-contents > ul > li > ul > li > ul {
    display: none;
}

This limits the TOC to rendering 2 levels, but doesnā€™t take into account H1 vs H2 vs H3. It might be enough for you. I would suggest trying it out by adding the following text to a note that using the TOC plugin.

<style>
    .table-of-contents > ul > li > ul > li > ul {
        display: none;
    }
</style>
5

I checked the css snippet and Iā€™d like to suggest a slight change so that the css customization will affect only the TOC and not the normal numbered lists:

nav.table-of-contents ol { counter-reset: list-item; }
nav.table-of-contents li { display: block; counter-increment: list-item; }
nav.table-of-contents li:before { content: counters(list-item,'.') ' '; }
6

Good point, Iā€™ll edit my reply so that people look at your solution instead.

1 Like
7

The solution with hiding sub-sections in TOC using CSS is sufficient for me and works just fine.
Thanks!

8

Good question which would deserve a separate topic. Other people would then be able to search for it.

9

Unfortunately the plugin we are using does not allow to set the max depth. Other plugins have an option for that.
Otherwise it could be easily done with an additional option in settings, that is if Laurent were to give the ok.

I can open a feature request with the plugin owner and we can go from there.

10

@laurent it is possible to set the depth with an option already. Would you accept a PR for that?

The only question is, how can I add an additional option next to the Enable table of contents extension text in the settings screen. Is that even possible?

What i need is a way to have a checkbox on the left, then text Enable specific TOC depth and then right next to it a field where I can enter a number from 1 to 10. But I havenā€™t seen a way to do that. Settings only seem to allow 2 elements. How can I use 3 in one line? (checkbox, text, number field).
If I wanted to go with my initial idea, the Enable table of contents extension line would need 5 elements.

11

You could avoid that adding the option into the editor instead of into the settings. Then you would be able to set a depth per note. Something like:

[toc depth:2]
2 Likes
12

I would prefer this approach since indeed different TOC might require different depths, however I don't think the plugin supports this. If we put some dev effort into this, maybe we should make a PR on the upstream repository.

13

I contacted the developer, regarding a max level setting, because it was not clear that the level option could be used for that. In the README it rather says to set the minumum level, but one can set an array of levels.

Ha, ok, this definitely requires an upstream change. @petrkrejcik feel free to open a feature request with the upstream module.

But this idea is a real good one.If everything else fails we could create a clone of the module on npm and add it ourselves. Although I'm not very keen on maintaining the toc module.

14

@petrkrejcik I really like your idea, but I am not sure, if the owner of the module is willing to make such a change, otherwise people want to be able to add all options to the call, like [toc options-here]. But maybe you are lucky.
Please open a feature request with the module. I think this time it should be somebody other than me asking for a change. :wink:

15

I've raised a feature request in the module's repo and although the author likes the idea he says it's incredibly hard to implement it...

16

set toc depth to 2 levels

$<toc{"level":[1,2]}>

set toc depth to 3 levels and use an ordered list

$<toc{"level":[1,2,3],"listType":"ol"}>
5 Likes