Automatically generate Table of Contents with Koenig Editor

Hey, I was just wondering if someone thought of this?

This could be a simple card that you could add, along side the HTML, markdown and other cards in the Koenig Editor.

Would this be something that the ghost team want in the Koenig editor? I’m open to make a contribution, I do need some guidance on where in the ghost core this should be implemented.

Some basic jquery can get all the header elements and then you would just need to format the output:

$("h1, h2, h3, h4, h5, h6")

Edit: I use a table of contents for pretty much every post on my website. It’s really useful for the user and myself as well - it just makes it easier to navigate long form articles.

The problem is that I can spend a good 5 minutes doing this manual task for every post, but it’s not that hard to automate.

Here are some example implementations of per-page TOC:

http://pixelandkraft.com/blockster/demo/docs/#navwidget

http://scrollnav.com

2 Likes

Hi denvergeeks, this was not what I was looking / aiming for. The following picture is what I’m imaging, i.e. not a fixed TOC following you all the way, but a static one that you put at the top of your post.

Check it out here: https://mlfromscratch.com/web-scraping-machine-learning/#tableofcontentsclicktoscroll

Thank you for clarifying @MLFromScratch. I agree that adding an automating component to the editor itself for a TOC is a great idea.

If that is implemented it would be great to provide both a fixed and a static option.

Here is a JQuery for this purpose:

http://gregfranko.com/jquery.tocify.js/

And here is a nice Ghost theme using it:

2 Likes

Here is another alternative to Tocify that does not depend on JQuery:

1 Like

I have implemented the tocbot script on an instance of the docuhub theme https://docuhub.t2themes.com


1 Like

Sounds like a good idea.

In my opinion, sometimes TOCs are just distracting and kill the “excitement”, but they are handy and i agree with this idea to have the option. Voted :slight_smile:

It really depends on what type of website you are running. I write comprehensive articles where I teach Machine Learning, i.e. I explain certain conceps, and it’s really nice to have a roadmap for each article.

3 Likes

You are totally right. Having the option doesnt hurt in my opinion. Let’s see what the team thinks.

1 Like

Incase anyone here missed this in the other thread, I’ve written a tutorial on how to add a table of contents to their Ghost site:

https://ghost.org/tutorials/adding-a-table-of-contents/