DiscoTOC - automatic table of contents

Sorry, my bad, I forgot to add important detail: it only seems to exhibit this behaviour in shared drafts category (I’m currently preparing a long topic with multiple posts in shared drafts and I totally forgot to check existing topics).

What I mean is that manual links to headings in the TOC enabled topic inserted into this same topic aren’t working, but this also seems connected only to the shared drafts category.

It turns out that the real culprits are the non-ascii characters inside the headings.

Titles with non-ascii characters

### Title with 'quotes'
### Title with non-ascii cháractérs

are assigned anchors that are url encoded as:

[link](#title-with-%E2%80%98quotes%E2%80%99)
[link](#title-with-non-ascii-ch%C3%A1ract%C3%A9rs)

and as soon as there is one such anchor in the post, all links to headings fail.

Perhaps it would be better just stripping all non-ascii characters rather then url encoding them?

Can you please confirm you can reproduce this, I couldn’t repro this on try.discourse because TOC is not enabled there.

3 Likes

the table of content is not working on TOS page

1 Like

I can confirm this, with our guidelines page FAQ - Global Legal Empowerment Network Community Discussions

I think displaying the TOC on these pages has simply not been implemented or is by design - though I think it would be a good idea to add it.

2 Likes

Would someone know how I can adjust the font-size of the heading elements on the left?

Well, you decide which heading size to use inside the post, for example in this topic these are the heading used:

<h3 id="heading--1">What are themes and theme components?</h3>

<h4 id="heading--1-1">Themes</h4>

<h4 id="heading--1-2">Theme Components</h4> 

In the OP it is well described:

4 Likes

I am referring to the font-size in the CSS, which seems to inherit the size from the anchor tag. I have tried to override this, but seems to be mixed in somewhere.

Not sure why you need to change the font size via CSS if you already have the headings, however something like this should work:

.d-toc-item {
    font-size: {your-custom-size}px;
}
.d-toc .d-toc-subheading li a {
    font-size: {your-custom-size}px;
}

Then you can play even with the selected heading with the .d-toc-active element.

3 Likes

I’m using umlauts in one of my German-speaking Discourse forums, and they render nicely. So this is not a problem with the ASCII-character set, but more probably with the URL-encoding of certain character sets. Umlauts would define as Extended ASCII, or simply plain UTF-8.

Überblick turns nicely into a clickable #überblick anchor and TOC entry.

Yet what breaks is the synchronised scrolling and highlighting of currently visible headlines in the TOC.

1 Like

Hello, i have 7 heading ## in heading #support
when have a lot of ## , page can’t load full page
everyone can see this video, my question is how can we fix it?
Thank you!

2 Likes

I think I’m seeing the same issue. I have a word doc we converted to markdown for testing, it’s going to take a few articles due to length. It seems like only part of the ToC loads, mostly the top level items. I’m seeing the same sort of random appearing and disappearing.

@Johani I can PM you the file if it helps, the server is on a private network.

4 Likes

Agreed. These are typically some of the longer pages on the site, so a TOC would be quite useful.

3 Likes

Dear Joe,
After i use Tab Bar for Mobile, Directory button on mobile was blocked by this theme component,
can you help fix.
image

First off… THANK YOU so much for this incredibly valuable plugin @Johani !!

I just wanted to follow up on these points noted by @TheBestPessimist, above.

We have a short table of contents and would like it to stay open and not auto-collapse. We only have 2 levels deep right now (##) with our TOC.

Is there a workaround or hack, or snippet of JS that would make it so it doesn’t collapse on desktop?

4 Likes

could it be that if a heading begins with numbers or symbols, that they are ignored and linke will be created on the following characters only.

## 23.MAR
## 15.MAR
## 20.FEB

will create a TOC like above but only with those two links

<topic>#MAR
<topic>#FEB

live example is here GSoC 2020 live blog - GSoC - Joplin Forum --> weekly update

It’s working fine on other post but on the latest post. I remember i just updated the component?

How do i make it work now?

Please reply

DiscoTOC is not intended to be used on replies - only on the first post in the topic. That’s why you don’t see it in the composer options menu.

edit: I thought you could hack it by manually inserting the code and I think you used to be able to do that but not anymore. :slight_smile:

1 Like

No, Sir.

What I meant is I just created a new TOPIC. It is not working. When i checked my previous topics if it is still working there, i saw no issues.

but it is not working on any new topics. If i copy paste the previous working ones, it works. If i create new topic it does not.

Please help

hmm… when you say it is not working do you mean it is not showing up in the composer options? See screenshot. Also can you confirm that when you insert it, the preview on the right side should have a blue bar that says “This topic will contain a table of contents”.

It shows up but doesn’t work as intended. The links do not navigate to the desired section of post.

Working:

Not working:

Please help