DiscoTOC - automatic table of contents

The mobile scrolling issue fix is now merged. I also added a compatibility fix for the discourse Docs view, you can see it in action here on meta.

5 Likes

If you prefer to have the table of content always fully expanded, try adding this CSS to your theme

#d-toc li.d-toc-item > ul {
  max-height: 500em !important;
  overflow: visible !important;
  opacity: 1 !important;
}
4 Likes

Can confirm that’s been fixed as well :+1:

3 Likes

I might be missing something obvious (as it happens often). When I add a TOC I lose access to the top right wrench menu, so I cannot pin/unpin a topic (using for some long event pages).

So the only way to change is to temporarily remove the TOC to access the button.?

With Disco:

Without Disco:

3 Likes

Yes, this is by design. In this case you can use the wrench on the topic menu, at the bottom.

4 Likes

My wrench menus are different. The right side one at top right (which disappears with DiscoTOC) shows:

and my bottom topic one:

So I have no access to the Pin topic settings there (unless I am looking at wrong wrench)

1 Like

Yes, you are looking at the wrong wrench. :wink: The second screenshot you provided is of the post admin wrench, at the bottom of every post. There is another admin wrench in the topic menu at the very bottom, before suggested topics.

3 Likes

Oi! I had the wrong wrench. Now I got it, many apologies, all is good

3 Likes

I seem to be missing the anchor links next to the headings, which allowed me to link to a specific section directly, for instance in this topic, like described in the start post:

Is this me or did this functionality disappear?

2 Likes

They should be there? I’m currently on my phone, but I grabbed this one by long-pressing on the gap to the side of the heading:

https://meta.discourse.org/t/discotoc-automatic-table-of-contents/111143#how-does-it-work-3

2 Likes

Yes, that topic has those anchor links, but that’s a topic that does not have the DiscoTOC.

But this topic has a TOC and does not have anchors: Beginner's guide to using Discourse Themes and this one does not have anchors either DiscourseConnect - Official Single-Sign-On for Discourse (sso)

EDIT Hmm…this topic does have anchors: Discourse API Documentation

3 Likes

Ah, I can explain. The topic you linked has html headings (<h3>, <h4> and so on) and initially the TOC component had its own logic for adding heading anchors. However, since then, core added automatic anchors and recently I removed the custom anchor login in the theme component. However, core’s anchor feature only works for Markdown headings (using ###).

So that’s the OP here has anchors, but the linked guide doesn’t.

We probably should update that guide to use Markdown instead of HTML @JammyDodger.

5 Likes

Ah! That explains things perfectly, thanks Penar!!

4 Likes

I was clearly not paying enough attention yesterday. :slight_smile: I have now swopped in Markdown headers for the two example topics. :+1:

2 Likes